getJSON在單擊按鈕時不起作用，但與按Enter鍵有關

Question

如果用戶在填寫字段后按回車，則我的getJSON請求和我函數的其余部分都可以正常工作，但是如果他們單擊搜索按鈕，我的函數就不會超過getJSON請求。

我在SO上找到了類似的帖子，但是還不能解決我的問題。 我曾嘗試在.click事件之前添加.live，還嘗試在幾個不同的位置添加e.preventDefault，但這也沒有解決。

我的HTML看起來像這樣

<input id="zipCode" maxlength="5" type="text"> <button id="zipSearch" onclick="findByZip()">Search</button></p>

我的JS看起來像這樣

$(document).ready(function () {
    $('#zipSearch').click(findByZip);

    $('#zipCode').bind('keydown', function (e) {

        if (e.keyCode === 13) { // 13 is enter key
            e.preventDefault();
            findByZip();
            return false;
        }
    });
}
);

function findByZip() {
    console.log('running findByZip');
    var zip = $('#zipCode').val();
    var stateName = $('#stateName');
    stateName.text("Reps for " + zip);
    $("#results").empty();
    var url='//something.com/api/Reps?Zipcode=' + zip;
    console.log(url);
    $.getJSON(url, function (data) {
    console.log(data);
    if (data.length == 0) {
    var header = "<h3>No matches found.</h3>"
    $('#result').append(header);
    }
    else {
    $.each(data, function (i, item) {
    var header = "<h3>Manufacturer's Representative</h3>";
    var businessName = $("<h4 id=businessName" + i + "></h4>").text(item.BusinessName);
    var contactName = $("<h4 id=contactName" + i + "></h4>").text(item.Contact);
    var address = $("<div id=address" + i + "></div>").text(item.Address);
    var address2 = $("<div id=address2" + i + "></div>").text(item.City + ", " + item.State + " " + item.Zipcode);
    var phone1 = $("<div id=phone1" + i + "></div>").text("PH: " + item.Phone1);
    var phone2 = $("<div id=phone2" + i + "></div>").text("PH2: " + item.Phone2);
    var fax = $("<div id=fax" + i + "></div>").text("FAX: " + item.Fax);
    var email = '<div id=email' + i + '><a href="' + item.Email + '">' + item.Email + '</a></div>';
    var website = '<div id=website' + i + '><a href="' + item.Website + '">' + item.Website + '</a></div>';
    if (item.RegionalRepId == item.Id) {
    header = "<h3>Regional Manager</h3>";
    }
    $("#results").append(header, businessName, contactName, address, address2, phone1, phone2, fax, email, website);
    if (businessName[0].textContent == "null") {
    $("#businessName" + i).remove();
    }
    if (contactName[0].textContent == "null") {
    $("#contactName" + i).remove();
    }
    if (address[0].textContent == "null") {
    $("#address" + i).remove();
    $("#address" + i).remove();
    }
    if (phone1[0].textContent == "PH:null") {
    $("#phone1" + i).remove();
    }
    if (phone2[0].textContent == "PH2:null") {
    $("#phone2" + i).remove();
    }
    if (fax[0].textContent == "FAX:null") {
    $("#fax" + i).remove();
    }
    if (email.includes("null")) {
    $("#email" + i).remove();
    }
    if (website.includes("null")) {
    $("#website" + i).remove();
    }
    });
    }
    });
    }  

預期的結果是僅通過不同的單擊事件提取並顯示數據，然后搜索到地圖。 單擊狀態有效，輸入郵政編碼，然后按Enter鍵有效，但是鍵入郵政編碼並單擊搜索無效。

如果你們有任何建議，將不勝感激。 在我的職業生涯中很年輕，主要工作於.NET，C＃和Xamarin。 不幸的是，JS和JQuery對我來說有點新。 謝謝！

Answer 1

我的表單沒有通過“提交”按鈕阻止表單的默認設置。 這只是防止輸入默認值。 在<button>標記中添加type="button"一切正常。