表單提交預防技術不起作用

我想完成的工作我以前做了好幾次，但有些東西似乎有所不同。這是我第一個使用laravel的項目，我正在構建的是非常基礎的。儘管如此，我認爲這個問題完全是一個HTML/JS問題，但是我認爲我應該把它放在那裏，因爲我很激動。表單提交預防技術不起作用

行爲，我試圖讓

用戶進入輸入字段，按Enter鍵和，而不是提交表單，從運行（這樣我可以使用Ajax防止形式，然而阿賈克斯還不是這個方程的一部分）。

我已經試過

這裏的HTML。

<form action="test" method="POST"> 
    <input type="text" id="text_input" class="form-control" autocomplete="off" /> 
    <input type="submit" id="submit_input" class="btn btn-success" /> 
</form>

這裏是我試過的一些javascript。

這在過去的項目中有效。但是在這個項目中，會發生警報，但表單已提交。當我在開始時將返回值設置爲false時，它會阻止表單提交，但是，我無法運行任何代碼。

$(document).ready(function() { 
    $('#submit_input').click(function() { 
     alert(); 
     $('#text_input').val() = ''; 
     $('#text_input').focus(); 
     return false; 
    }); 
});

我試過使用preventDefault，它允許警報運行，但確實運行後的任何代碼。

$(document).ready(function() { 
    $('form').submit(function (e) { 
     e.preventDefault(); 
     alert(); 
     $('#text_input').val() = ''; 
     $('#text_input').focus(); 
    }); 
});

解決方案我不希望

我知道，我可以得到按鈕輸入提交或在重點領域的回車鍵，並獲得這種行爲，而不使用HTML表單，但也許我會，但是，我想知道是什麼導致這不起作用。

的jsfiddle

我做錯了我的jsfiddle，所以我不能用這個來證明。我之前沒有在jsfiddle上使用表單，並且出現錯誤{「error」：「請使用POST請求」}但我不知道爲什麼，因爲我在表單中指定了該帖子。

http://jsfiddle.net/r50h0a44/

其他信息

與Laravel 5這樣做，使用WAMP，使用jQuery 2.1加載，在Chrome，在我的控制檯沒有錯誤。請幫忙。

來源

2015-05-03 Goose

您以錯誤的方式使用val()。你應該這樣調用它$('#text_input').val('some text');

更新：你應該用你的代碼的第二個變體（與e.preventDefault()）

來源

2015-05-03 01:39:30

這是一個評論，不是答案。 –

如果解決了這個問題，這是一個答案。並非每一個答案都需要很長時間 –

這是一個答案，因爲這正是導致問題的原因！我很驚訝Chrome Inspect控制檯沒有顯示錯誤。我想這在技術上是有效的。我也會使用第二個變體，因爲我知道這是最佳做法。感謝您的快速和正確的迴應。 – Goose

表單提交預防技術不起作用

回答

相關問題