AJAX調用問題

當用下拉菜單調用JSP時，我的AJAX調用工作正常，但使用submit按鈕調用時，內容消失並刷新頁面。AJAX調用問題

function najax() { 
    $.ajax({ 
     url:"testjsp.jsp", 
     type: "post", 
     data: { 
      crid: crid, 
      sid: sid, 
      ttid: ttid 
     }, 
     async: false, 
     cache: true, 
     error: function(xhr, status, error) { 
      alert("error" + error); 
      alert("xhr" + xhr); 
      alert("status" + status); 
     }, 
     sync: true, 
     success: function(responseText) { 
      $("#disp_span").html(responseText); 
     } 
    }); 
}

調用的代碼：

<input type="submit" name="Submit " id="submit" value="Submit" class="btn" onClick="najax();" ></input>

如果我添加一個下拉菜單，然後它的作品。

<select name="select_menu1" onChange="najax();"> 
    <option value=" ">Select</option> 
    <option value="cr_id">SUBMIT</option> 
    <option value="sr_id">CANCEL</option>

來源

2015-11-06 kunal snehi

將輸入類型更改爲'button' – guradio

這是因爲你在這裏有一個表單。表單中的任何按鈕都將提交表單。刪除表單並看到它工作..沒有錯你的代碼 –

'窗體內的任何按鈕將提交表單'不正確。正如@Pekka所說，如果你將'type'設置爲'button'，那麼它不會提交父表單。 –

爲了避免表單的提交更改輸入類型button

<input type="button" name="Submit " id="submit" value="Submit" class="btn">

然後在按鈕上點擊調用功能

$('#submit').click(function() { 
    //najax() 
     //Or call the ajax directly 

    $.ajax({ 
     url: "testjsp.jsp", 
     type: "post", 
     data: { 
      crid: crid, 
      sid: sid, 
      ttid: ttid 
     }, 
     async: false, 
     cache: true, 
     error: function(xhr, status, error) { 
      alert("error" + error); 
      alert("xhr" + xhr); 
      alert("status" + status); 
     }, 
     sync: true, 
     success: function(responseText) { 
      $("#disp_span").html(responseText); 
     } 
    }); 
})

來源

2015-11-06 11:08:57 guradio

但是爲什麼它會使用按鈕類型而不是提交類型？ –

，因爲如果你輸入的是提交，它會提交你的表格，這就是爲什麼它正在重新加載 – guradio

哦，這就像that.ohkay .. –

停止從提交如下

$("#formid").submit(function() { return false; });

來源

2015-11-06 10:56:52

但是OP需要什麼？ –

這是要停止表單的提交如果用戶不想提交表單，爲什麼要使用表單呢？ –

是的，也是正確的。因爲如果用戶不單擊按鈕並在任何文本字段上按回車，那麼也從將被提交 –

或更好，但只使用一個type="button"按鈕

來源

2015-11-06 10:58:11

你把一個函數Ajax請求，但你不要把它在提交像你一樣在下拉菜單上做的按鈕onChange="najax();"

<input onClick="najax();" type="submit" name="Submit " id="submit" value="Submit" class="btn"></input>

t他應該工作或使用jQuery來爲你做。 :)

來源

2015-11-06 11:00:30

如果您想用submit按鈕進行ajax調用，然後將提交事件添加到表單。

，如果你想防止button提交表單和執行Ajax操作，然後阻止默認動作

$('#submit').click(function(e){ 
     e.preventDefault(); 
     ....//ajax call 
    });

來源

2015-11-06 11:04:00 Ramanlfc

回答

相關問題