Question

＆lt; a href =“＃/ new-page”onclick =“MyFunction（）”＆gt;打开页面＆lt; / a＆gt;

目前的工作是onclick在href之前工作，因为在改变URL之前执行了“MyFunction（）”。我希望首先使用href更改URL，然后执行onclick。

是否有任何可用的方法可以实现此目的，我不想使用“location.href”或任何其他动态URL更改方法

Answer 1

使用 history.js ：

＆＃13;

// this should be the Ajax Method.
// and load the url content
var setCurrentPage = function(url) {
    $('h2 span').html(url || "/");
    $("#menu-nav a[href='" + url + "']").fadeTo(500, 0.3);
};

$('#menu-nav a').click(function(e){
    e.preventDefault();
    var targetUrl = $(this).attr('href'),
        targetTitle = $(this).attr('title');
    
    $("#menu-nav a[href='" + window.location.pathname + "']").fadeTo(500, 1.0);
    
    window.history.pushState({url: "" + targetUrl + ""}, targetTitle, targetUrl);
    setCurrentPage(targetUrl);
});

window.onpopstate = function(e) {
    $("#menu-nav a").fadeTo('fast', 1.0);
    setCurrentPage(e.state ? e.state.url : null);
};

＆＃13;

body {margin:10px}
h1 {font-size:20px}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
    <h2>Current Page: <span>/</span></h2>
    <ul id="menu-nav">
        <li><a href="/page-1/" title="Pagina 1">Page 1</a></li>
        <li><a href="/page-2/" title="Pagina 2">Page 2</a></li>
        <li><a href="/page-3/" title="Pagina 3">Page 3</a></li>
    </ul>

＆＃13;

更新1 ：

尝试使用此

<a onclick="event.stopPropagation();if(this.href==undefined || this.href==''){fnMyCustomFunction();return;}else{window.location=this.href;}">This will call the function</a>

首先检查是否存在href，如果是，则=>它不会调用该函数，但导航到href位置

DEMO：fiddle

在onclick之前更改URL

1 个答案: