在AJAX响应后重新触发javascript默认事件

我有一个基于选项卡的设置，并且标签内容是异步加载的。在AJAX响应后重新触发javascript默认事件

<nav> 
    <ul> 
    <li><a href="/default" class="handle current" data-handle="default">OVERVIEW</a></li> 
    <li><a href="/services" class="handle" data-handle="services">SERVICES</a></li> 
    <li><a href="/clients" class="handle" data-handle="clients">CLIENTS</a></li> 
    </ul> 
</nav> 
</div> 
    <div class="tab selected" data-handle="default" data-populated="true">Some stuff in here.</div> 
    <div class="tab unselected" data-handle="services" data-source="/services-snipet" data-populated="false"></div> 
    <div class="tab unselected" data-handle="clients" data-source="/clients-snipet.html" data-populated="false"></div> 
</div>

我已附加事件到handle类，使得它可以移动current类和适当地切换selected/unselected类。但是，在进行切换之前，它将在新选项卡上检查dataset["populated"]。如果这是false，它将通过AJAX加载dataset["source"]并填充。

此外，我使用event.preventDefault()作为该过程的一部分，以免跟随标签本身的链接。

所有这一切都工作得很好。

问题是我想能够重新触发默认事件 - 链接 - 如果AJAX请求失败或超时。有没有某种方式暂停/延迟默认事件，直到我有异步AJAX响应，所以可以决定，如果我想防止它呢？有没有一种替代机制可以让我在开始时阻止它，然后在AJAX失败或超时时重新触发它？或者，我是唯一选择阅读this的href并在失败情况下重定向页面？

（无jQuery的，请）

来源

2014-10-08 Rick

这是一个解决preventDefault-issue的解决方案：http://stackoverflow.com/questions/7610871/how-to-trigger-an-event-after-using-event-preventdefault – 2014-10-08 11:36:51

谢谢阿德里安 - 我已经看到了那一个。命名空间的污染使我感到厌烦;它将有效地重新运行相同的检查过程。 – Rick 2014-10-08 13:30:28

如果命名空间污染是您不喜欢该解决方案的唯一事情，那么您可以始终将该标志与该元素本身相关联。也许在事件处理程序中使用jQuery的.data（）和$（this）.data（）来设置/读取该标志。 – 2014-10-08 14:52:46

在你的Ajax调用以填充failiure你可以改变document.location.href强制重定向：

DEMO

function ajax(event) { 
    console.log(event); 
    if(event.detail === 1) { 
     event.preventDefault(); 
     var target = event.target; 
     var xmlhttp = new XMLHttpRequest(); 
     xmlhttp.onreadystatechange = function() { 
      if (xmlhttp.readyState == 4) { 
       if(xmlhttp.status == 200){ 
        //Do normal stuff 
       } 
       else 
       { 
        //Do the same event but without prevetion 
        target.click(); 
       } 
      } 
     } 

     xmlhttp.open("GET", "ajax.php", true); 
     xmlhttp.send(); 
    } 
}; 

var elements = document.querySelectorAll("li a"); 
for(i=0; i<elements.length; i++) { 
    elements[i].addEventListener("click", ajax, false); 
}

来源

2014-10-08 11:47:40

这是我期待的后备...只是希望有一个更通用的选项，不假定默认操作/要求它总是手动定义。 – Rick 2014-10-08 13:32:21

你是什么意思，默认行动？链接的默认操作是重定向。 – 2014-10-08 13:34:46

在这种情况下，它在链接上。但是如果我想把它放在别的东西上呢？（不，我想不出具有默认行为的特定其他事物...） – Rick 2014-10-08 17:55:25

在AJAX响应后重新触发javascript默认事件

回答

相关问题