在前端开发中,少不了对Checkbox的操作。

常用的的不二法门有2个:.is()和.prop()方法。前者是判断
checkbox的意况,选不是未选。而后者为checkbox设置一个值,可以安装checkbox是true依然false。

写个小例子,磨炼一下:
在html:

<input id="Checkbox1" type="checkbox"  />
<input id="Text1" type="text"   />

 

 为这多少个文本框赋值,值填的就是checkbox的值。只是用户对checkbox采取与否。
jQuery 1

上边的代码,假若不想利用if
,可以参照下边的的jQuery代码修改一下,最终的结果是一样的:
jQuery 2

 

jQuery 3jQuery 4

 $('#Checkbox1').change(function () {
            var self = $(this);

            //if (self.is(":checked")) {
            //    self.attr("checked", true);
            //}
            //else {
            //    self.attr("checked", false);
            //}

            self.attr("checked", self.is(":checked"));

            $('#Text1').val(self.is(':checked'));
        });

Source Code

 

实时演示:
jQuery 5

 

上面磨炼.prop()方法,为checkbox设置值。
把地点的事例对调一下,即是说依据文框输入的值来控制checkbox是否采取与否。
当用户输入“true”时,checkbox是选中的情状,当用户输任何非”true”值时或未填写时,checkbox的情况是非选中的。

<input id="Text1" type="text" />
<input id="Checkbox1" type="checkbox" />

 

jQuery, 写jQuery代码:
jQuery 6

 

演示:
jQuery 7

 

相关文章

网站地图xml地图