0

我对复选框单击事件有疑问。用户将填写 5 个输入，这些输入创建输入值的全局变量。用户然后填写表格的其余部分，然后单击验证复选框以同意规则/规定。这个复选框应该填充一个隐藏的文本区域，其中包含 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>

这是触发事件发布到文本区域的复选框：

<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>
4

2 回答 2

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

});
于 2013-08-04T04:40:57.227 回答
1

有同样的问题，看到这个帖子。

因为我只是在做一个测试，所以我决定把点击调用放在复选框上：

<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 调用中遇到了这个问题）。

于 2017-08-06T23:22:50.583 回答