<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
function buttonCol_1(){
var col_1 = document.getElementById("col_1").value;
var col_1_result = document.getElementById("col_1_result");
col_1_result.innerHTML = '<div class="ibm-col-'+col_1+'">'+' '+'</div>';
/*输出效果：<div class="ibm-col-6-5"> </div>*/
}
function buttonCol_2(){
var col_2 = document.getElementById("col_2").value;
var col_2_result = document.getElementById("col_2_result")
col_2_result.innerHTML = '<div class="ibm-col-'+col_2+'">'+' '+'</div>';
/*输出效果：<div class="ibm-col-6-5"> </div>*/
}
</script>
</head>
<body>
<input type="text" size="40" placeholder="col-?-?" id="col_1">
<br/>
<br/>
<input type="text" size="40" placeholder="col-?-?" id="col_2">
<br/>
<br/>
<input type="button" value="Get col_1" onclick="buttonCol_1()">
<input type="button" value="Get col_2" onclick="buttonCol_2()">
<br/>
<br/>
<div id="col_1_result"> </div>
<div id="col_2_result"> </div>
</body>
</html>
3 回答
chanway
TA贡献3条经验 获得超0个赞
col_1_result.innerHTML = '<div class="ibm-col-'+col_1+'">'+' '+'</div>';
就算你直接写在body里面这段html也不会有什么显示，因为这就是一个标签又没有任何内容，还有js去赋值的浏览器查看源代码也不会显示出来。
qq_舎吥得_0
TA贡献1条经验 获得超0个赞
输出效果的话这样写
col_1_result.innerHTML = "<div class=\"ibm-col-"+col_1+"\">"+‘ ’+"</div>";
丶小八戒
TA贡献18条经验 获得超7个赞
col_1_result.innerHTML = '<div class="ibm-col-'+col_1+'">'+' '+'</div>'; col_2_result.innerHTML = '<div class="ibm-col-'+col_2+'">'+' '+'</div>'; 你这两句输出的本来就是一个空内容，你要把变量拼接上去... col_1_result.innerHTML = '<div class="ibm-col-'+col_1+'">'+ col_1 +'</div>'; col_2_result.innerHTML = '<div class="ibm-col-'+col_2+'">'+ col_2 +'</div>';
添加回答
举报
0/150
提交
取消