我一直回到“未定义”的值...不确定为什么它不在for循环中工作，但在alert($("#evalRate1").val());之上确实会返回正确的值。
背景： 我正在建立一个评估系统，并且当评估员选择“否”以供可接受的使用时，无论员工选择了什么，我都希望隐藏评论区域。这是我到目前为止的代码。
代码： //在所有问题周围加上蓝色边框 $（“。Questions”）。css（“border”，“1px solid blue”）; //提醒用户注意ID evalRate1的值 警报（$（ “＃evalRate1”）VAL（））;
//loop from 1 to 15 for all items to hit every question
for(var i = 1; i <= 15; i++) {
var selfRateID = "selfRate" + i;
var evalRateID = "evalRate" + i;
var selfCmntID = "selfCmnt" + i;
var evalCmntID = "evalCmnt" + i;
alert("Variable is: " + evalRateID);
alert("Value is: " + $('#evalRateID').val());
//check the evaluator answer
//if the evaluator answer == 'No' (value = 0), hide the comment section
if($('#evalRateID').val() == 0) {
$(".Comments").css("display", "none");
alert("Hiding element!");
} else {
alert("Value was not == 0");
}
</script>
生成的CFML输出为HTML： 我的评估测试页面 #pageTable { 宽度：100％; 边框：1px纯黑色; } .Questions { 宽度：100％; } 。评论 { 宽度：100％; } 题 评估员得分 自我评分
<tr>
<table class="Questions">
<tr id="Question1">
<td>1. This represents a question.</td>
<td width="150px"><select name="evalRate1" id="evalRate1">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate1" id="selfRate1">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts1" >
<td id="evalCmnt1">Evaluator Comment:<br />
<textarea name="evalCmnt1" cols="30" rows="6" readonly="readonly" id="evalCmnt1">This represents an evaluator comment for question #1.</textarea></td>
<td id="selfCmnt1">Self Comment:<br />
<textarea name="selfCmnt1" cols="30" rows="6" readonly="readonly" id="selfCmnt1">This represents a self comment for question #1.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question2">
<td>2. This represents a question.</td>
<td width="150px"><select name="evalRate2" id="evalRate2">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate2" id="selfRate2">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts2" >
<td id="evalCmnt2">Evaluator Comment:<br />
<textarea name="evalCmnt2" cols="30" rows="6" readonly="readonly" id="evalCmnt2">This represents an evaluator comment for question #2.</textarea></td>
<td id="selfCmnt2">Self Comment:<br />
<textarea name="selfCmnt2" cols="30" rows="6" readonly="readonly" id="selfCmnt2">This represents a self comment for question #2.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question3">
<td>3. This represents a question.</td>
<td width="150px"><select name="evalRate3" id="evalRate3">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate3" id="selfRate3">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts3" >
<td id="evalCmnt3">Evaluator Comment:<br />
<textarea name="evalCmnt3" cols="30" rows="6" readonly="readonly" id="evalCmnt3">This represents an evaluator comment for question #3.</textarea></td>
<td id="selfCmnt3">Self Comment:<br />
<textarea name="selfCmnt3" cols="30" rows="6" readonly="readonly" id="selfCmnt3">This represents a self comment for question #3.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question4">
<td>4. This represents a question.</td>
<td width="150px"><select name="evalRate4" id="evalRate4">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate4" id="selfRate4">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts4" >
<td id="evalCmnt4">Evaluator Comment:<br />
<textarea name="evalCmnt4" cols="30" rows="6" readonly="readonly" id="evalCmnt4">This represents an evaluator comment for question #4.</textarea></td>
<td id="selfCmnt4">Self Comment:<br />
<textarea name="selfCmnt4" cols="30" rows="6" readonly="readonly" id="selfCmnt4">This represents a self comment for question #4.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question5">
<td>5. This represents a question.</td>
<td width="150px"><select name="evalRate5" id="evalRate5">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate5" id="selfRate5">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts5" >
<td id="evalCmnt5">Evaluator Comment:<br />
<textarea name="evalCmnt5" cols="30" rows="6" readonly="readonly" id="evalCmnt5">This represents an evaluator comment for question #5.</textarea></td>
<td id="selfCmnt5">Self Comment:<br />
<textarea name="selfCmnt5" cols="30" rows="6" readonly="readonly" id="selfCmnt5">This represents a self comment for question #5.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question6">
<td>6. This represents a question.</td>
<td width="150px"><select name="evalRate6" id="evalRate6">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate6" id="selfRate6">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts6" >
<td id="evalCmnt6">Evaluator Comment:<br />
<textarea name="evalCmnt6" cols="30" rows="6" readonly="readonly" id="evalCmnt6">This represents an evaluator comment for question #6.</textarea></td>
<td id="selfCmnt6">Self Comment:<br />
<textarea name="selfCmnt6" cols="30" rows="6" readonly="readonly" id="selfCmnt6">This represents a self comment for question #6.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question7">
<td>7. This represents a question.</td>
<td width="150px"><select name="evalRate7" id="evalRate7">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate7" id="selfRate7">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts7" >
<td id="evalCmnt7">Evaluator Comment:<br />
<textarea name="evalCmnt7" cols="30" rows="6" readonly="readonly" id="evalCmnt7">This represents an evaluator comment for question #7.</textarea></td>
<td id="selfCmnt7">Self Comment:<br />
<textarea name="selfCmnt7" cols="30" rows="6" readonly="readonly" id="selfCmnt7">This represents a self comment for question #7.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question8">
<td>8. This represents a question.</td>
<td width="150px"><select name="evalRate8" id="evalRate8">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate8" id="selfRate8">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts8" >
<td id="evalCmnt8">Evaluator Comment:<br />
<textarea name="evalCmnt8" cols="30" rows="6" readonly="readonly" id="evalCmnt8">This represents an evaluator comment for question #8.</textarea></td>
<td id="selfCmnt8">Self Comment:<br />
<textarea name="selfCmnt8" cols="30" rows="6" readonly="readonly" id="selfCmnt8">This represents a self comment for question #8.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question9">
<td>9. This represents a question.</td>
<td width="150px"><select name="evalRate9" id="evalRate9">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate9" id="selfRate9">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts9" >
<td id="evalCmnt9">Evaluator Comment:<br />
<textarea name="evalCmnt9" cols="30" rows="6" readonly="readonly" id="evalCmnt9">This represents an evaluator comment for question #9.</textarea></td>
<td id="selfCmnt9">Self Comment:<br />
<textarea name="selfCmnt9" cols="30" rows="6" readonly="readonly" id="selfCmnt9">This represents a self comment for question #9.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question10">
<td>10. This represents a question.</td>
<td width="150px"><select name="evalRate10" id="evalRate10">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate10" id="selfRate10">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts10" >
<td id="evalCmnt10">Evaluator Comment:<br />
<textarea name="evalCmnt10" cols="30" rows="6" readonly="readonly" id="evalCmnt10">This represents an evaluator comment for question #10.</textarea></td>
<td id="selfCmnt10">Self Comment:<br />
<textarea name="selfCmnt10" cols="30" rows="6" readonly="readonly" id="selfCmnt10">This represents a self comment for question #10.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question11">
<td>11. This represents a question.</td>
<td width="150px"><select name="evalRate11" id="evalRate11">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate11" id="selfRate11">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts11" >
<td id="evalCmnt11">Evaluator Comment:<br />
<textarea name="evalCmnt11" cols="30" rows="6" readonly="readonly" id="evalCmnt11">This represents an evaluator comment for question #11.</textarea></td>
<td id="selfCmnt11">Self Comment:<br />
<textarea name="selfCmnt11" cols="30" rows="6" readonly="readonly" id="selfCmnt11">This represents a self comment for question #11.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question12">
<td>12. This represents a question.</td>
<td width="150px"><select name="evalRate12" id="evalRate12">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate12" id="selfRate12">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts12" >
<td id="evalCmnt12">Evaluator Comment:<br />
<textarea name="evalCmnt12" cols="30" rows="6" readonly="readonly" id="evalCmnt12">This represents an evaluator comment for question #12.</textarea></td>
<td id="selfCmnt12">Self Comment:<br />
<textarea name="selfCmnt12" cols="30" rows="6" readonly="readonly" id="selfCmnt12">This represents a self comment for question #12.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question13">
<td>13. This represents a question.</td>
<td width="150px"><select name="evalRate13" id="evalRate13">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate13" id="selfRate13">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts13" >
<td id="evalCmnt13">Evaluator Comment:<br />
<textarea name="evalCmnt13" cols="30" rows="6" readonly="readonly" id="evalCmnt13">This represents an evaluator comment for question #13.</textarea></td>
<td id="selfCmnt13">Self Comment:<br />
<textarea name="selfCmnt13" cols="30" rows="6" readonly="readonly" id="selfCmnt13">This represents a self comment for question #13.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question14">
<td>14. This represents a question.</td>
<td width="150px"><select name="evalRate14" id="evalRate14">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
<td width="150px"><select name="selfRate14" id="selfRate14">
<option value="0">No</option>
<option value="1" selected="selected">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts14" >
<td id="evalCmnt14">Evaluator Comment:<br />
<textarea name="evalCmnt14" cols="30" rows="6" readonly="readonly" id="evalCmnt14">This represents an evaluator comment for question #14.</textarea></td>
<td id="selfCmnt14">Self Comment:<br />
<textarea name="selfCmnt14" cols="30" rows="6" readonly="readonly" id="selfCmnt14">This represents a self comment for question #14.</textarea></td>
</tr>
</table>
</tr>
<tr>
<table class="Questions">
<tr id="Question15">
<td>15. This represents a question.</td>
<td width="150px"><select name="evalRate15" id="evalRate15">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
<td width="150px"><select name="selfRate15" id="selfRate15">
<option value="0" selected="selected">No</option>
<option value="1">Yes</option>
</select></td>
</tr>
</table>
</tr>
<tr>
<table class="Comments">
<tr align="center" id="Cmnts15" >
<td id="evalCmnt15">Evaluator Comment:<br />
<textarea name="evalCmnt15" cols="30" rows="6" readonly="readonly" id="evalCmnt15">This represents an evaluator comment for question #15.</textarea></td>
<td id="selfCmnt15">Self Comment:<br />
<textarea name="selfCmnt15" cols="30" rows="6" readonly="readonly" id="selfCmnt15">This represents a self comment for question #15.</textarea></td>
</tr>
</table>
</tr>
</table>
</form>
<script type="text/javascript">
//put a blue border around all questions
$(".Questions").css("border", "1px solid blue");
//alert user to value of ID evalRate1
//alert($("#evalRate1").val());
//loop from 1 to 15 for all items to hit every question
for(var i = 1; i <= 3; i++) {
var selfRateID = "selfRate" + i;
var evalRateID = "evalRate" + i;
var selfCmntID = "selfCmnt" + i;
var evalCmntID = "evalCmnt" + i;
var CommentsID = "Cmnts" + i;
alert("Variable is: " + evalRateID);
//check the evaluator answer
//if the evaluator answer == 'No' (value = 0), hide the comment section
if($('#evalRateID').val() == 0) {
$(".Comments").css("display", "none");
} else {
alert("Value was: " + $('#evalRateID').val());
}
}
</script>
</body>
</html>
答案 0 :(得分：7)
这是错误的。
if($('#evalRateID').val() == 0) {
应该是这样。
if($('#' + evalRateID).val() == 0) {
第一个查找标识"evalRateID"。
第二个查找存储在evalRateID变量中的id。
答案 1 :(得分：5)
见行
alert("Value is: " + $('#evalRateID').val());
它只会搜索ID为evalRateID的元素，但您要搜索evalRate1。所以使用
alert("Value is: " + $('#'+evalRateID).val());
因为evalRateID被定义为变量。
答案 2 :(得分：1)
根据脚本在文档中的位置，您可能需要按如下方式包装代码：
$(function() {
// ...
//all code goes here
// ...
});
这确保在DOM准备好之前不会执行包含的代码 - 即，直到服务的HTML / CSS被解释为DOM节点。