为什么我这个输出不了结果？

<!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>

阿尔滨必胜

浏览 1567回答 3

3回答

chanway

col_1_result.innerHTML = '<div class="ibm-col-'+col_1+'">'+' '+'</div>'; 就算你直接写在body里面这段html也不会有什么显示，因为这就是一个标签又没有任何内容，还有js去赋值的浏览器查看源代码也不会显示出来。

0 0

qq_舎吥得_0

输出效果的话这样写col_1_result.innerHTML = "<div class=\"ibm-col-"+col_1+"\">"+‘ ’+"</div>";

0 0

丶小八戒

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 0

随时随地看视频慕课网APP