复选框更改/点击事件未触发

Question

我遇到复选框单击事件问题。 用户将填写5个创建输入值全局变量的输入。 然后用户填写表格的其余部分，然后单击验证复选框以同意规则/法规。这个复选框应该填充一个隐藏的textarea，其中包含5个变量，并带有一些预定义的文本。

它似乎在大部分工作，但我收到一些空白条目。因此，复选框触发事件不能正确触发。我做了大量的浏览器测试，无法找出原因。

我正在为Shortstack应用程序平台上的一些自定义代码进行比赛/ facebook抽奖活动。

我已经尝试了以下两种触发事件，但都没有解决问题。

$('#promotion_agree').change(function() { 

和

$('#promotion_agree').on("click", function(event) { 

我的代码如下。任何帮助深表感谢。

<script type="text/javascript"> 

jQuery(document).ready(function($) { 

//Fade out the Agree to Rules/Regulations checkbox 

$('#promotion_agree_block').fadeOut(); 

//Input Field 1 
$('#promotion_custom_field_2').bind("keyup change", function() { 
    fieldone = $(this).val(); 
    $('#promotion_custom_field_5').val(fieldone); 
}); 

//Input Field 2 
$('#promotion_custom_field_3').bind("keyup change", function() { 
    fieldtwo = $(this).val(); 
    $('#promotion_custom_field_7').val(fieldtwo); 
}); 

//Input Field 3 
$('#promotion_custom_field_4').bind("keyup change", function() { 
    fieldthree = $(this).val(); 
    $('#promotion_custom_field_8').val(fieldthree); 
}); 

//Input Field 4 
$('#promotion_custom_field_17').bind("keyup change", function() { 
    fieldfour = $(this).val(); 
    $('#promotion_custom_field_9').val(fieldfour); 
}); 

//Input Field 5 
$('#promotion_custom_field_18').bind("keyup change", function() { 
    fieldfive = $(this).val(); 
    $('#promotion_custom_field_37').val(fieldfive); 
    $('#promotion_agree_block').fadeIn(); 
}); 



////Post the global variables to the hidden textarea along with the included text 

$('#promotion_agree').on("click", function(event) { 

//The following code is placed in the textarea field that is hidden 

$('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after  enjoying the Superdogs show where he saw lots of ' + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 


    }); 
}); 
</script> 

编辑原始发帖下面...

HTML代码如下所示：

这是一个输入的样子：

<div class="field_block custom_field_2_field_block text_field_type_block center-input" id="promotion_custom_field_2_block"> 
<label for="promotion_custom_field_2"><span class="main_field_label">Field One</span><span class="required">*</span></label> 
<input class="small" id="promotion_custom_field_2" name="promotion[custom_field_2]" type="text"> 
</div> 

这是触发事件发布到textarea的复选框：

<div class="field_block agree_field_block black-text" id="promotion_agree_block" style="display: block;"> 
<label for="promotion_agree"><input id="promotion_agree" name="promotion[agree]" type="checkbox" value="1"> <span class="main_field_label">I have read and agree to the rules &amp; regulations</span><span class="required">*</span></label> 
</div> 

文本区域看起来像上面的复选框被选中之后。

<div class="field_block image_description_field_block" id="promotion_image_description_block"> 
<label for="promotion_image_description"><span class="main_field_label">MadLib Story</span></label> 
<textarea class="medium" id="promotion_image_description" name="promotion[image_description]">test1 walked through The Fair, after enjoying the Superdogs show where he saw lots of test2, test3 dogs. They leapt through hoops and over jumps and test4 with their trainers. He thought about how great it would be if his dog test5 became a Superdog! Maybe one day... 

提交词：TEST1，TEST2，TEST3，TEST4，TEST5

第二个编辑 下面是一个编辑，我的JavaScript代码来填充说明字段为每个元素键入的形式将不填充上提交某种原因使说明文字我想这可能工作：

<script type="text/javascript"> 

jQuery(document).ready(function($) { 


$('#promotion_custom_field_2').bind("keyup change", function() { 
//Create Global Variable for Text entered 
    fieldone = $(this).val(); 

    //Add Global Variable to Hidden Field 
    $('#promotion_custom_field_5').val(fieldone); 

    //Update Description Field if Changed 
    $('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after enjoying the Superdogs show where he saw lots of ' 
             + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' 
             + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' 
             + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 

}); 



$('#promotion_custom_field_3').bind("keyup change", function() { 
//Create Global Variable for Text entered 
    fieldtwo = $(this).val(); 

    //Add Global Variable to Hidden Field 
    $('#promotion_custom_field_7').val(fieldtwo); 

    //Update Description Field if Changed 
    $('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after enjoying the Superdogs show where he saw lots of ' 
             + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' 
             + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' 
             + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 


}); 

$('#promotion_custom_field_4').bind("keyup change", function() { 
//Create Global Variable for Text entered 
    fieldthree = $(this).val(); 

    //Add Global Variable to Hidden Field 
    $('#promotion_custom_field_8').val(fieldthree); 

    //Update Description Field if Changed 
    $('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after enjoying the Superdogs show where he saw lots of ' 
             + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' 
             + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' 
             + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 

}); 

    $('#promotion_custom_field_17').bind("keyup change", function() { 
    //Create Global Variable for Text entered 
    fieldfour = $(this).val(); 

    //Add Global Variable to Hidden Field 
    $('#promotion_custom_field_9').val(fieldfour); 

    //Update Description Field if Changed 
    $('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after enjoying the Superdogs show where he saw lots of ' 
             + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' 
             + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' 
             + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 

}); 

    $('#promotion_custom_field_18').bind("keyup change", function() { 
//Create Global Variable for Text entered 
    fieldfive = $(this).val(); 

    //Add Global Variable to Hidden Field 
    $('#promotion_custom_field_37').val(fieldfive); 

    //Update Description Field if Changed 
    $('#promotion_image_description').html('' + fieldone + ' walked through The Fair, after enjoying the Superdogs show where he saw lots of ' 
             + fieldtwo + ', ' + fieldthree + ' dogs. They leapt through hoops and over jumps and ' 
             + fieldfour + ' with their trainers. He thought about how great it would be if his dog ' 
             + fieldfive + ' became a Superdog! Maybe one day...\r\n\r\n Submitted Words: ' + fieldone + ', ' + fieldtwo + ', ' + fieldthree + ', ' + fieldfour + ', ' + fieldfive + ''.replace(/\r\n/g, '\n').split('\n')); 


}); 


    }); 
    </script> 

Answer 1

尝试此复选框更改事件

$(document).ready(function(){ 
    $("input[type=checkbox]").change(function(){ 
     if($(this).is(":checked")){ 
      alert("Checked"); 
      //$(this).siblings("input[type=checkbox]").removeAttr("checked"); 
      }else{ 
      alert("Unchecked") 
      } 
     }); 

}); 

Answer 2

有同样的问题，看到这篇文章。

因为我只是做一个测试，我决定干脆把单击呼叫上的复选框：

<input id="chk_selected" name="chk_selected" type="checkbox" 
     value="@x.GetValue("pic_pk_Idx_n")" onclick="clickchange(this)" /> 

所以，如果你有这样的问题，我会说，用这个。

然而，重要的是要明白为什么以下行有问题：

$('#chk_selected').change(function() { 
    $('#chk_selected').on("click", function (event) { 

请注意，这可能是一个jQuery的版本问题（我在AJAX有这个问题调用）。