javascript - 点击ajax中的链接不起作用

Question

这是我的 ajax 和 html 代码。当我单击链接上的“收件人国家/地区”时，无法加载我在下面的 GET 方法中调用的“recipient_country.html”。

<div id = "topbar">
    <ul>
        <li>
            <a href="#recipient_country.html" onclick = "recipient_country()">Recipient Country</a>
        </li>
    </ul>
</div>
<div id = "content"></div>

function recipient_country(e) {

    (e || window.event).preventDefault();

    var con = document.getElementById('content'), xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function (e) { 

        if (xhr.readyState == 4 && xhr.status == 200) {
            con.innerHTML = xhr.responseText;
        }
    }

    xhr.open("GET", "recipient_country.html", true);
    xhr.setRequestHeader('Content-type', 'text/html');
    xhr.send();
}

Answer 1

您忘记将参数event传递给调用方法。由于参数不匹配，recipient_country(e) 方法永远不会被调用。单击时将事件传递给函数。

 <li><a href="#recipient_country.html" onclick = "recipient_country(event)">Recipient Country</a></li>