嗨，我正在尝试验证正在处理的表单，并且我编写了一个函数并使用了
document.getElementById("span_trav_emer_med_insur").style.backgroundColor ='#FFFFFF';
我测试了我的函数来显示一个警告消息框，因为当“trav_emer_med_insur”被选中时显示消息框进行调试。我在这里和其他无数网站上进行了检查，他们都说
getElementById.style.backgroundColor = 'color';是实现我所寻找的方法。我现在不明白为什么它不起作用，一切似乎正确。这是我功能的开始，相关部分:
function validatePlanTypes(form) {
var error = "";
if (form.trav_emer_med_insur.checked) {
document.getElementById("span_trav_emer_med_insur").style.backgroundColor = '#FFFFFF';
if (!form.trav_emer_med_insur_opt1.checked || !form.trav_emer_med_insur_opt2.checked || !form.trav_emer_med_insur_opt3.checked || !form.trav_emer_med_insur_opt4.checked) {
form.trav_emer_med_insur_opt1.style.backgroundColor = 'Yellow';
form.trav_emer_med_insur_opt2.style.backgroundColor = 'Yellow';
form.trav_emer_med_insur_opt3.style.backgroundColor = 'Yellow';
form.trav_emer_med_insur_opt4.style.backgroundColor = 'Yellow';
error = "You must pick a plan-type for Travel Emergency Medical insurance, areas with a problem have been highlighted yellow for you.";
}
我还没有测试完整的功能，这时候我只是在测试第一个if语句，因为我说过if语句可以工作并且alert(“bleh”);如果我选中该框，将显示警报
这是表单的HTML，我试图更改复选框周围的span元素的背景颜色。
<p><span name="span_trav_emer_med_insur" id="span_trav_emer_med_insur" value="span_trav_emer_med_insur" style=""><input type="checkbox" name="trav_emer_med_insur" id="trav_emer_med_insur_if" value="trav_emer_med_insur_if" class="form_elements" onClick="if(this.checked){document.getElementById('trav_emer_med_options').style.display='block';}else{document.getElementById('trav_emer_med_options').style.display='none';}"/></span> <!-- Travel Emergency Medical If Box -->
<label class="form_elements" name="label_for_trav_emer_med_insur_if" id="label_for_trav_emer_med_insur_if"> Travel Emergency Medical Insurance <em>(expands when checked)</em>.</label></p>
<p>
<div id="trav_emer_med_options" name="trav_emer_med_options" class="questions_hidden">
我也尝试过
form.span_trav_emer_med_insur.style.backgroundColor = '#FFFFFF';
同样无济于事，我真的很困惑，代码看起来和我在网上看到的完全一样。有人请告诉我我想念的是什么。
谢谢，
-西恩
编辑-仅用于验证:
if (form.trav_emer_med_insur.checked) {
alert("bleh");
代替
if (form.trav_emer_med_insur.checked) {
document.getElementById("span_trav_emer_med_insur").style.backgroundColor = '#FFFFFF';
确实有效，因此if语句或函数不是问题。
此处的完整文件-getelementbyID不起作用-http://hotfile.com/dl/135598683/93484d4/general2.html
完整文件，此处带有alert('bleh')警告-
http://hotfile.com/dl/135598746/dc9e14b/general23.html
有效的PHP代码准确显示了我要执行的操作(减去页面重新加载部分):
// Check if Emergency Medical is selected.
if (isset($_POST['trav_emer_med_insur'])) {
// If Emergency Medical is selected, then check to see if an option has been selected
if (isset($_POST['trav_emer_med_insur_opt1']) or isset($_POST['trav_emer_med_insur_opt2']) or isset($_POST['trav_emer_med_insur_opt3']) or isset($_POST['trav_emer_med_insur_opt4'])) {
$SQLString = $SQLString . "emer_med, emer_med_opt1, emer_med_opt2, emer_med_opt3, emer_med_opt4";
}
// If no option is selected display error message
else {
++$ErrCount;
$Errors[$ErrCount] = "You selected interest in Travel Emergency Medical Insurance but did not select a plan-type for it";
}
}
// Check if All-Inclusive Insurance is selected.
elseif (isset($_POST['allinc_insur'])) {
//If All-Inclusive Insurance is selected, then check to see if an option has been selected
if (isset($_POST['allinc_insur_opt1']) or isset($_POST['allinc_insur_opt2'])) {
}
//If no option is selected display error message
else {
++$ErrCount;
$Errors[$ErrCount] = "You have selected interest in All-Inclusive Insurance but did not select a plan-type for it";
}
}
// Check if Cancellation Insurance is selected.
elseif (isset($_POST['cancel_insur'])) {
}
// Check if Visitor Insurance is selected.
elseif (isset($_POST['visitor_insur'])) {
//If Visitor Insurance is selected, then check to see if country is selected.
if (isset($_POST['country_select'])) {
}
// If no country selected display error message
else {
++$ErrCount;
$Errors[$ErrCount] = "You have selected interest in Visitor Insurance but have not selected a country";
}
}
//If no insurane types selected display error.
else {
++$ErrCount;
$Errors[$ErrCount] = "You haven not selected interest in any insurance plan types";
}
while ($Count != $Target) {
if (checked($QuestionNames[0]) != 1);
++$Count;
}
最佳答案
您是否尝试过从一开始就给跨度提供颜色只是为了确认您可以看到它？
由于您的代码看起来完全正常，因此可能只是看不到span背景色。
对于什么是值得的，我同意OP的观点，即将jquery用于诸如此类的琐碎事情是浪费带宽。
根据您的评论，我创建了一个测试页来模拟您的评论。
这有效:
<span name="span_trav_emer_med_insur" id="span_trav_emer_med_insur" style='backgroundcolor:red'>
some words<input type="checkbox" name="trav_emer_med_insur" id="trav_emer_med_insur_if" value="trav_emer_med_insur_if" class="form_elements" onClick="clck(this)"/>
</span>
<label class="form_elements" name="label_for_trav_emer_med_insur_if" id="label_for_trav_emer_med_insur_if"> Travel Emergency Medical Insurance <em>(expands when checked)</em>.</label></p>
<div id="trav_emer_med_options" name="trav_emer_med_options" class="questions_hidden" style='display:none;'>
some hidden words
</div>
<script type="text/javascript">
function clck(cbObj) {
if(cbObj.checked){
document.getElementById("span_trav_emer_med_insur").style.background = "green";
document.getElementById('trav_emer_med_options').style.display='block';
}
else {
document.getElementById("span_trav_emer_med_insur").style.background = "red";
document.getElementById('trav_emer_med_options').style.display='none';
}
}
</script>