1
我不斷回覆「未定義」的值......不知道爲什麼它不在for循環中工作，但在alert($("#evalRate1").val());之上的確會返回正確的值。DOM元素回來undefined
背景： 我正在建立一個評價體系，並想隱藏的區域徵求意見時，評價者選擇「否」可接受的使用，不管員工選擇了什麼。這是我迄今爲止的代碼。
代碼： //把一個藍色邊框的所有問題 $（ 「問題 」）的CSS（「 邊界」， 「1px的固體藍」）。 //提醒用戶注意ID值evalRate1 alert（$（「＃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純黑色; } 。問題：寬度：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>
Wold也可以用來顯示源輸出，而不是其中的coldfusion變量，以便可以真正評估JavaScript。 –
不要把#evalRateID放在單引號內可能是一個好的開始。 –