首次单击后 href 未运行，但 onclick 运行

Question

我有这个打开模式的按钮。

我正在模态中打开一个新页面，并在调用新页面之前进行另一个 api 调用进行处理。

<a class="btn btn-primary" type='button' id="btn_prev" onclick="prev({{charm_id}})" data-toggle="modal" data-toggle="modal" data-target="#innerModal" href="{% url 'gifcharm:showpreview' %}">Preview</a>

这是我的按钮元素。

首先，我使用onclick进行api调用，然后在onclick之后，href加载新页面。

现在，问题是，

当我第一次单击该按钮时，onclick 和 href 都有效。 onclick 进行后台处理，href 很好地加载了新内容。

但在第一次调用之后，只有 onclick 有效，href 调用永远不会进行。随着我的内容在一段时间后发生变化，我需要再次调用 href 以加载新内容。

但相同的旧内容会继续加载，而新内容永远不会加载。 为什么会这样？

编辑 - 附加的 JS 文件。

function prev( charm_id){
var imageselected=[];
$("input:checkbox").each(function(){
    var $this = $(this);
    if($this.is(":checked")){
        imageselected.push($this.attr("id"));
    }
});

console.log(imageselected);
var url_creategif = "http://localhost:8000/gifcharm/convert_to_gif/" + charm_id;
console.log(url_creategif);

                    jQuery.ajax({
                                type: "GET",
                                url: url_creategif,
                                cache:false,
                                data: {
                                  'images': imageselected
                                },
                                success: function(data){
                                  if(data == "0"){
                                      alert("Problem Creating Gif");
                                  }else{
                                    //alert("Circle Image is successfully created");
                                  }
            }
          });
//url = "http://localhost:8000/gifcharm/showpreview";
};

Answer 1

当同一标签中同时存在onclick事件和href事件时，onclick事件优先。

在您的prev 函数末尾添加一个return true; 语句，一旦您完成了您在其中所做的任何事情。一旦函数返回 true，href 就会执行。如果点击回调没有返回任何内容或返回 false，则 href 将被忽略。