如何使用JQuery中的輸入框修改CSS

這是我正在嘗試工作的代碼，我無法弄清楚爲什麼JQ不會從輸入框拾取＃cols1 var。如何使用JQuery中的輸入框修改CSS

這是我正在使用的代碼的基本示例。

<html> 
<head> 
<script type='text/javascript' src='http://code.jquery.com/jquery-2.1.0.min.js'> 
</script> 
<script type='text/javascript'> 

function changeCon() 
{ 
var cols1 = $('#col1').value; 
$('#div1').html('Random text'); 
$('#div1').css({ backgroundColor: "#cols1" }); 
} 

function startup() 
{ 
$('#bt1').click(changeCon); 
} 
$(startup); 

</script> 
</head> 
<body> 
<input id='col1' type='text' /> <br /> 
<div id="div1">text div.</div> 
<input type="button" id="bt1" value="Submit" /> 
</body> 
</html>

如果有誰知道是爲什麼，這將是巨大的歡呼聲。

來源

2014-10-26 Mattlinux1

做這樣的

var cols1 = $('#col1').val(); 
$('#div1').html('Random text'); 
$('#div1').css({ backgroundColor: "#" + cols1 });

或

var cols1 = $('#col1')[0].value; 
$('#div1').html('Random text'); 
$('#div1').css({ backgroundColor: "#" + cols1 });

來源

2014-10-26 22:46:19 theliberalsurfer

謝謝你的工作。這是使用之間的一個很大的區別：var bcol = document.getElementById（「bcols」）.value;和document.getElementById（'div1'）。style.backgroundColor = bcol;但仍然在學習JQ。 – Mattlinux1 2014-10-26 22:51:38

jQuery對象沒有value屬性（代表HTML表單控件的DOM元素）。 jQuery對象有a val() method。

來源

2014-10-26 22:44:40 Quentin

昆汀是正確的。
JS不是PHP，你必須使用$('#div1').css({ backgroundColor: '#'+cols1 });而不是"#cols1"。

來源

2014-10-26 22:50:12 ddlab

如何使用JQuery中的輸入框修改CSS

回答

相關問題