jQuery флажок изменить и нажмите кнопку событие



у меня есть



<input type="checkbox" id="checkbox1" /> <br />
<input type="text" id="textbox1" />


и



$(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?");
}
});
});


JSFIDDLE ссылке



здесь измененное событие обновляет значение текстового поля со статусом флажка. Я использую событие click для подтверждения действия при снятии флажка. Если пользователь выбирает cancel, флажок восстанавливается, но изменение даже срабатывает до подтверждения, оставляя вещи в несогласованном состоянии (текстовое поле говорит false, когда флажок установлен). Как я могу справиться с отменой и сохранить значение текстового поля соответствует состоянию проверки?

612   16  

16 ответов:

Ну, я не вижу ответа, который соответствует моему, поэтому я опубликую это. Проверено в JSFiddle и делает то, что вы просите.Этот подход имеет дополнительное преимущество запуска при нажатии метки, связанной с флажком.

Оригинальный Ответ:

$(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);        
    });
});

демо

использовать mousedown

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

большинство ответов не поймают его (предположительно), если вы используете <label for="cbId">cb name</label>. Это означает, что при нажатии на метку он будет установлен флажок, а не непосредственно нажав на флажок. (Не совсем вопрос, но различные результаты поиска, как правило, приходят сюда)

<div id="OuterDivOrBody">
    <input type="checkbox" id="checkbox1" />
    <label for="checkbox1">Checkbox label</label>
    <br />
    <br />
    The confirm result:
    <input type="text" id="textbox1" />
</div>

в этом случае вы можете использовать:

Earlier versions of jQuery:

$('#OuterDivOrBody').delegate('#checkbox1', 'change', function () {
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

пример JSFiddle с jQuery 1.6.4

jQuery 1.7+

$('#checkbox1').on('change', function() { 
    // From the other examples
    if (!this.checked) {
        var sure = confirm("Are you sure?");
        this.checked = !sure;
        $('#textbox1').val(sure.toString());
    }
});

пример JSFiddle с последним jQuery 2.x

  • добавлены примеры jsfiddle и html с кликабельной меткой флажка

хорошо .. просто ради спасения головной боли (здесь уже за полночь) я мог бы придумать:

$('#checkbox1').click(function() {
  if (!$(this).is(':checked')) {
    var ans = confirm("Are you sure?");
     $('#textbox1').val(ans);
  }
});

надеюсь, что это помогает

для меня это прекрасно работает:

$('#checkboxID').click(function () {
    if ($(this).attr('checked')) {
        alert('is checked');
    } else {
        alert('is not checked');
    }
})

вы

Html

<input id="ProductId_a183060c-1030-4037-ae57-0015be92da0e" type="checkbox" value="true">

JavaScript

<script>
    $(document).ready(function () {

      $('input[id^="ProductId_"]').click(function () {

        if ($(this).prop('checked')) {
           // do what you need here     
           alert("Checked");
        }
        else {
           // do what you need here         
           alert("Unchecked");
        }
      });

  });
</script>

избавьтесь от события изменения и вместо этого измените значение текстового поля в событии click. Вместо того, чтобы возвращать результат подтверждения, поймайте его в var. Если это правда, измените значение. Затем верните ВАР.

флажок нажмите и проверьте значение в том же цикле событий является проблемой.

попробуйте это:

$('#checkbox1').click(function() {
    var self = this;
    setTimeout(function() {

        if (!self.checked) {
            var ans = confirm("Are you sure?");
            self.checked = ans;
            $('#textbox1').val(ans.toString());
        }
    }, 0);
});

Demo:http://jsfiddle.net/mrchief/JsUWv/6/

попробуй такое

$('#checkbox1').click(function() {
        if (!this.checked) {
            var sure = confirm("Are you sure?");
            this.checked = sure;
            $('#textbox1').val(sure.toString());
        }
    });
$(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')) {
            if(!confirm("Are you sure?"))
            {
                $("#checkbox1").prop("checked", true);
                $('#textbox1').val($(this).is(':checked'));
            }
        }
    });
});
// this works on all browsers.

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

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


<div id="check">
    <input type="checkbox" id="checkbox1" />
    <input type="text" id="textbox1" />
</div>

Если вы используете Icheck Jquery используйте приведенный ниже код

 $("#CheckBoxId").on('ifChanged', function () {
                alert($(this).val());
            });

просто использовать событие click мои проверки удостоверения личности коробка CheckAll

     $('#CheckAll').click(function () {

        if ($('#CheckAll').is(':checked') == true) {

             alert(";)");
      }
    }

получить значение радио по имя

 $('input').on('className', function(event){
        console.log($(this).attr('name'));
        if($(this).attr('name') == "worker")
            {
                resetAll();                 
            }
    });

Я не уверен, почему все это так сложно. Это все, что я сделал.

if(!$(this).is(":checked")){ console.log("on"); }

Comments

    Ничего не найдено.