Question

我想使用JSP从JSON页面获取一些数据。 JSON接收参数userId，基于userId，用户详细信息填充在JSON页面中。我正在使用getJSON()方法从页面获取数据。但是，我的问题是当点击一个按钮时，表单就会被提交。这个fiddle是没有getJSON()方法的方法，在按下提交后不提交表单，但Here表单是在我点击按钮后提交的。我回来false仍然没有用。

请告诉我如何在不提交表格的情况下从JSON获取数据。如果有任何替代或更好的方法，请建议一个。

这是我的代码：

$("input[name=submit]").click(function(){
    var dataToBeSent = $("form").serialize();
    alert (dataToBeSent);
    $.getJSON(url,dataToBeSent, function(data) {
        var items = [];
        $.each(data, function(key, val) {
            items.push('<li id="' + key + '">' + val + '</li>');
        });
        $('div').html($('<ul/>', {
            'class' : 'my-new-list',
            html : items.join(' ')
        }));
    });
    return false;

此致

Dibya

Answer 1

你需要做event.preventDefault（）

$("input[name=submit]").click(function(e){
    ................
    ................
    ................
    ................
    e.preventDefault();
});

return false不会停止事件，因为它与object.onclick不相似。要停止默认行为，必须使用preventDefault。

Answer 2

尝试将其转换为函数返回而不是像这样的事件侦听器：

<script type="text/javascript">
    function serializeForm(){
        var dataToBeSent = $("form").serialize();
        alert(dataToBeSent);
        // $.getJSON(); function here
        return false;
    }
</script>
<form action="#submit" method="post" onsubmit="return serializeForm();">
    <input type="text" name="data1" id="data1" value="1" />
    <input type="text" name="data2" id="data2" value="2" />
    <input type="text" name="data3" id="data3" value="3" />
    <input type="submit" />
</form>

如何防止按钮提交表单

2 个答案: