Question

所以，我有一点问题。我有一些链接，当它们被点击时在jQuery中运行一个函数，但是，我第一次点击链接时没有任何反应。如果我再次单击它，该函数会运行两次，如果我第三次单击它，它会从该单击运行三次。

这是我的jQuery代码

function updateEntryStatus() {
    var anime_id = <?php echo $anime_id; ?>;
    var anime_list_entry_id = <?php echo $anime_list_entry_id; ?>;

        jQuery('.wantedStatus').on('click', function(event)
        {
                    var wantedStatus = jQuery(this).text();

                jQuery.post("/wp-content/themes/sahifa/phanime_list/updateStatus_animelist.php", {firstParam : anime_id, secondParam : anime_list_entry_id, thirdParam : wantedStatus}, function(data) {
                //this is your response data from serv
                console.log(data);
                                jQuery('#anime_list_update').html(data);

            });
            return false;
        });
    }

以下是我的几个链接

<a href="javascript:void(0);" onclick="updateEntryStatus();" class="wantedStatus">Watching</a> | 

<a href="javascript:void(0);" onclick="updateEntryStatus();" class="wantedStatus">Plan to watch</a> | 

<a href="javascript:void(0);" onclick="updateEntryStatus();" class="wantedStatus">On hold</a> | 

<a href="javascript:void(0);" onclick="updateEntryStatus();" class="wantedStatus">Dropped</a>

示例：

点击1：没有任何反应

单击2：函数运行两次。

单击3：功能运行3次/总共运行5次。

单击4：功能运行4次/总共运行9次等等...

我假设这是我在我的功能中设置点击的方式。

Answer 1

只需要这个

                    jQuery('.wantedStatus').on('click', function(event)
                    {
                        var wantedStatus = jQuery(this).text();

                            jQuery.post("/wp-content/themes/sahifa/phanime_list/updateStatus_animelist.php", {firstParam : anime_id, secondParam : anime_list_entry_id, thirdParam : wantedStatus}, function(data) {
                                //this is your response data from serv
                            console.log(data);
                            jQuery('#anime_list_update').html(data);

                        });
                            return false;
                    });
                }

更新updateEntryStatus（）函数。

Answer 2

在有人点击该链接之前，您不会设置onclick事件。每次他们点击链接时，您都会设置另一个事件处理程序。

将jQuery('.wantedStatus').on('click', function(event)调用移到updateEntryStatus()函数之外，并确保在有人点击该链接之前调用.on()函数。

首次单击链接不会触发jQuery，但再次单击它会触发两次

2 个答案: