复选框onclick不会更改通过jscript检查的

Question

我有3个复选框，我希望能够单击该框，它会打勾开/关，并通过jscript更改要发布到状态天气项目的输入值是否在另一页上接受。 但是我有逻辑脚本，但是它不会工作，没有错误，但是复选框不会单击开/关，他们只是单击，多数民众赞成在它..和值不会改变，要么我不明白为什么。

有人可以看一下这段简短的代码，然后告诉我为什么。

谢谢。

<input  type="checkbox" id="paypal" name="paypal1"  value=" " onclick='chbxpp();' >
</input>
<label for="paypal" class="checkboxes" >Show PayPal Accepted</label>

<br>

<input   type="checkbox" id="facebook"  name="facebook"  value=" "  onclick='chbxfb(this);' >
</input>
<label for="facebook" class="checkboxes"  >Show FaceBook Contact Details</label>

<br>

<input   type="checkbox" id="twitter"  name="twitter"  value=" "  onclick='chbxtw(this);' >
</input>
<label for="twitter" class="checkboxes"  >Show Twitter Contact Details</label>



function chbxpp()
{

if(document.getElementById('paypal').checked === true) {
document.getElementById('paypal').checked = false;
document.getElementById('paypal').value='no';

var vv=document.getElementById('paypal').value;
console.log(vv);
}

if (document.getElementById('paypal').checked === false) {
document.getElementById('paypal').checked = true;
document.getElementById('paypal').value='yes';
var vv=document.getElementById('paypal').value;
console.log(vv);
}

}




function chbxfb(objfb)
{
var that = objfb;

(objfb);

if(document.getElementById(that.id).checked === true) {
document.getElementById(that.id).checked = false;
document.getElementById(that.id).value='no';

var vv=document.getElementById(that.id).value;

console.log(vv);

}

if (document.getElementById(that.id).checked === false) {
document.getElementById(that.id).checked = true;
document.getElementById(that.id).value='yes';

var vv=document.getElementById(that.id).value;

console.log(vv);

}

}



function chbxtw(objtw)
{
var that = objtw;
(objtw);


if(document.getElementById(that.id).checked === true) {
document.getElementById(that.id).checked = false;
document.getElementById(that.id).value='no';
var vv=document.getElementById(that.id).value;
console.log(vv);
}

if (document.getElementById(that.id).checked === false) {
document.getElementById(that.id).checked = true;

document.getElementById(that.id).value='yes';

var vv=document.getElementById(that.id).value;

console.log(vv);

}

}

objpp是我尝试的另一种方法，但是却做了同样的事情...

ps如果我只是不使用jscript而只是html，如果未单击该复选框，该值将无效还是该值仍会发送...

iv就是这样。

如何使用JQuery更改复选框onClick的值？

指出如果未选中该框，则不会发送该值。但是在发布后，我如何知道单击了什么。 $ _POST ['paypal']）

Answer 1

我想象您的复选框开始时不会在其中进行检查或.checked === false，但是当您调用函数chbxpp（）时，它会查看您的.checked属性是否=== true，如果是，它将其设置为false 。 click事件已经为您更改了复选框的.checked属性，而无需在代码中执行。

//If the checkbox is checked, set it to not checked...??? 
//But the problem is, the click event just set the .checked property to true
//so setting it back to false makes it like it never happened.
if(document.getElementById('paypal').checked === true) {
   //document.getElementById('paypal').checked = false; //This part is a no-no
   document.getElementById('paypal').value='yes';

}else{
   document.getElementById('paypal').value='no';
}

Answer 2

添加到Ryan Wilson的答案中，将cbx的初始值设置为false。 （还检查cbx的格式-结束标记。）

<input  type="checkbox" id="paypal" name="paypal1"  value="false" onchange="chbxpp();" />

function chbxpp() {

    // the cbx starts false. when it is clicked for the first time it
    // becomes true.

    if (document.getElementById('paypal').checked) {
        // you don't need this.
        //document.getElementById('paypal').checked = true;
        document.getElementById('paypal').value = 'yes';

        var vv = document.getElementById('paypal').value;
        console.log(vv);
    } else {
        // you also don't need this.
        //document.getElementById('paypal').checked = false;
        document.getElementById('paypal').value = 'no';
        var vv = document.getElementById('paypal').value;
        console.log(vv);
    }
}