Question

所以我试图通过php从服务器获取一些数据，但是一旦它加载到页面上，它似乎重新加载页面并使其再次消失。我的HTML：

<form id="searchForm">
<input name="searchValue" type="text" id="search">
<input type="submit" name="Submit" value="Zoek op klant"          onclick="getKlanten()">
</form>

<div id="klanten">
</div>

我的js：

function getKlanten(){
var value = $("#search").val();
$.ajax({
    url:'includes/getKlanten.php',
    async: false,
    type: 'POST',
    data: {'searchValue':value},
    success: function(data, textStatus, jqXHR)
    {
        $('#klanten').html(data);
    },
    error: function () {
        $('#klanten').html('Bummer: there was an error!');
    }
});
}

有人可以帮忙吗？它被放入div中，然后立即消失。

Answer 1

首先，避免使用内联点击处理程序。页面重新加载，因为默认情况下，表单将表单内容提交到action属性中指定的url。

而是将事件附加到表单并使用preventDefault来避免页面刷新。做这样的事情

china.mydomain.com

或者将事件附加到这样的输入按钮

$('#searchForm').on('submit', function(e){
  e.preventDefault();

  // your ajax request.
});

详细了解preventDefault here

[jQuery]使用.html（）附加html后页面刷新

1 个答案: