javascript - 链接与 onClick

Question

我有一个专门使用 AJAX 的 Web 应用程序，因此没有完全刷新，所有内容都设置为

<a href="javascript:...()">

它在 Chrome 和 Firefox 上运行良好，但每次我点击任何东西时 IE 都会要求确认页面重新加载。将链接更改为

href="#" 

并将功能变成onClick？

谢谢。

Answer 1

只需停止使用内联 JavaScript。你不需要它。

输出与数据属性中的元素关联的 id：

<a href="#" data-id="34" class="list-item">listitem1</a>

现在您可以从外部 js 文件绑定到这些点击事件：

$(document).ready(function(){
    $(".list-item").click(function(e){
        e.preventDefault(); // stop jump to top
        var theId = $(this).attr("data-id"); // get the id
        someFunction(theId); // execute some terribly written function
    });
});

这确实可以跨浏览器工作。

Answer 2

使用“href='#'”，你可能需要在你的 JS 函数中防止默认值，这样页面就不会因为 '#' 锚点而进入顶部。

我会做：

HTML

<a href="javascript:void(0)" class="someclass" rel='2'>

JS

$('.someclass').on('click', function(){
   var value = $(this).attr('rel');
   // use 'value' as you would normaly do with your function(2)
});

或者这个：

HTML

<a href="#" class="someclass" rel='34'>

JS

$('.someclass').on('click', function(e){
    e.preventDefault();

   var value = $(this).attr('rel');
   // use 'value' as you would normaly do with your function(34)
});

Answer 3

使用<a href="#" onclick="myFunction()"></a>.

此外，请确保在您的 javascript 函数中阻止事件传播，如下所示：

function myFunction() {
    //Your code here
    event.preventDefault ? event.preventDefault() : event.returnValue = false;
    return false;
}

这将阻止浏览器跳转到页面顶部并且与 IE 兼容，因为 IE 不使用event.preventDefault()