首頁猿問 jQuery復(fù)選框更改并單擊事件

jQuery復(fù)選框更改并單擊事件

JQuery JavaScript

有只小跳蛙 2019-07-25 18:53:05

jQuery復(fù)選框更改并單擊事件$(document).ready(function() { //set initial state. $('#textbox1').val($(this).is(':checked')); $('#checkbox1').change(function() { $('#textbox1').val($(this).is(':checked')); }); $('#checkbox1').click(function() { if (!$(this).is(':checked')) { return confirm("Are you sure?"); } });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><input type="checkbox" id="checkbox1"/><br /><input type="text" id="textbox1"/>

查看完整描述

3 回答

12345678_0001

TA貢獻1802條經(jīng)驗獲得超5個贊

好吧，我沒有看到與我匹配的答案，所以我會發(fā)布這個。在JSFiddle中測試并執(zhí)行您要求的操作。當單擊與復(fù)選框關(guān)聯(lián)的標簽時，此方法具有觸發(fā)的額外好處。

原答案：

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val($(this).is(':checked'));

    $('#checkbox1').change(function() {
        if($(this).is(":checked")) {
            var returnVal = confirm("Are you sure?");
            $(this).attr("checked", returnVal);
        }
        $('#textbox1').val($(this).is(':checked'));        
    });});

更新答案：

$(document).ready(function() {
    //set initial state.
    $('#textbox1').val(this.checked);

    $('#checkbox1').change(function() {
        if(this.checked) {
            var returnVal = confirm("Are you sure?");
            $(this).prop("checked", returnVal);
        }
        $('#textbox1').val(this.checked);        
    });});

反對回復(fù) 2019-07-25

子衿沉夜

TA貢獻1828條經(jīng)驗獲得超3個贊

演示

使用 mousedown

$('#checkbox1').mousedown(function() {
    if (!$(this).is(':checked')) {
        this.checked = confirm("Are you sure?");
        $(this).trigger("change");
    }});

反對回復(fù) 2019-07-25