我正在尝试实现一个简单的 Jquery 下拉菜单。
HTML
<h2> Networked Graphs</h2>
<p> Select the node ID from the drop down to see graphs up to a depth of 5 </p>
<form id="my form">
<label for="Node_type">Node_Type</label>
<select id="dropdown_change">
<option value="Customer">Customer</option>
<option value="Phone">Phone</option>
<option value="ID_Card">ID_Card</option>
</select>
<input type='submit' value='Submit'>
</form>
这是 jquery 代码:
var selectID = $("#dropdown_change").val();
$.ajax({
type: "POST",
url: '/echo/html/',
data: {
html: "<span>This is the ajax response...</span>",
delay: 2
},
success: function(data) {
showMsg('SUCCESS: ' + data);
},
error: function (xhr, textStatus, errorThrown) {
document.getElementById('dropdown_change').selectedIndex = 0;
showMsg('ERROR: ' + errorThrown);
return false;
}
});
}) // closes ?
从下拉列表中选择并单击提交按钮应显示成功消息“成功:这是 Ajax 响应”。
即使我指定“type: POST”和SUCCESS以及ERROR消息,它也会失败并出现以下错误:
{"error": "Please use POST request"}
这是Jsfiddle 。尝试学习 javascript/jquery。
最佳答案
一旦页面加载,jQuery Ajax 就会运行。单击该按钮时它不会运行。单击该按钮时,将提交 HTML 表单。
执行此操作的方法是向按钮添加一个监听器,以拦截提交并调用 jQuery Ajax。它看起来像这样:
$('input[type=submit]').click(function() {
var selectID = $("#dropdown_change").val();
$.ajax({...
return false;
});
这是一个工作 fiddle
关于javascript - 使用jquery的下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41029862/