Question

我尝试将此代码放在wordpress循环中：它应该通过id检查每个帖子的复选框状态以及是否检查 - 更新textarea的值（每次单击复选框后应更新）。但它只捕获了最后一篇文章的价值..虽然它在页面视图源中看起来是正确的（其所在位置的所有ID）

<!--wp loop begin-->
<!--post content-->
  <script>    
    $('.taglist input').click(function() {
    var sum=0;
    if (document.getElementById('<?php the_ID(); ?>').checked){sum+=1000;}     
    $('textarea').val(sum)
    ;}
    );
  </script>
<!--wp loop end-->

Answer 1

您应该将此代码置于循环之外，并按照您已经在执行的操作绑定每个元素上的单击：

<!--wp loop begin-->
<!--post content-->

<!--wp loop end-->
<script>    
    $('.taglist input').click(function() {
        var sum=0;
        if ($(this).checked){
                sum+=1000;
        } 
        $('textarea').val(sum);
    });
</script>

但我认为你会想要做更多这样的事情：

<!--wp loop begin-->
<!--post content-->

<!--wp loop end-->
<script>   
var sum = 0;
$('.taglist input').click(function() {
    if ($(this).prop('checked')){
        sum+=1000;
    } else {
        sum-=1000;
    }
    $('textarea').val(sum);
});
</script>

如果未选中复选框，我认为应该减去。

JSFiddle

Answer 2

您需要在wordpress循环之外声明sum变量。

<script>var sum = 0;</script>
<!--wp loop begin-->
<!--post content-->
  <script>    
    $('.taglist input').click(function() {
        if (document.getElementById('<?php the_ID(); ?>').checked) {
             sum+=1000;
        } else {
            sum-=1000;
        }
        $('textarea').val(sum);
    });
  </script>
<!--wp loop end-->

此外，如果有人取消选中复选框，我猜你需要从总和中删除1000.

实际上，一个更简洁的方法可能是将php id变量添加到循环中的数组中，然后在循环外执行其他操作 -

<script>
    var sum = 0;
    var checkboxIdArray = [];
</script>
<!--wp loop begin-->
<!--post content-->
  <script>
    checkboxIdArray.push('<?php the_ID(); ?>');
  </script>
<!--wp loop end-->
<script>

    $('.taglist input').click(function() {
        var id = $(this).attr('id');
        if (typeof checkboxIdArray[id] !== 'undefined') {
            if ($(this).prop('checked')) {
                sum+=1000;
                } else {
                    sum-=1000;
                }
            $('textarea').val(sum);
        }
    });

</script>

更新

好的，你根本不需要使用php变量 - 你只需要在点击回调中使用$(this)，就像Mihai Iorga所建议的那样。

使用来自wordpress循环的已检查项目的值的总和

2 个答案: