[英]How can I get the value of a hidden input field when submitting a form?
我的頁面上有多種形式。 每個表單都有兩個提交按鈕和一個包含ID的隱藏輸入字段。
當用戶單擊提交按鈕之一時，我需要將單擊的提交按鈕的值與隱藏輸入字段的值一起發送給表單提交。
這是我的頁面外觀的示例：
<form id="options">
<input type="hidden" value="104">
<input type="submit" onclick="this.form.submited=this.value;" value="Delete">
<input type="submit" onclick="this.form.submited=this.value;" value="Reply">
</form>
<form id="options">
<input type="hidden" value="44">
<input type="submit" onclick="this.form.submited=this.value;" value="Delete">
<input type="submit" onclick="this.form.submited=this.value;" value="Reply">
</form>
<form id="options">
<input type="hidden" value="39">
<input type="submit" onclick="this.form.submited=this.value;" value="Delete">
<input type="submit" onclick="this.form.submited=this.value;" value="Reply">
</form>
<script>
$(document).on("submit", "#options", function(e) {
e.preventDefault();
console.log(this.submitted) // gets the value of the submit button
});
</script>
目前，我只能通過表單提交發送單擊提交按鈕的值，而不能發送隱藏輸入字段的值。 雖然我知道我可以使用onclick="this.form.submited=this.previousElementSibling.value;" 要獲取ID，這意味着我無法獲取所單擊的提交按鈕的值。
您可以使用val() ：
var value = $('input[name="input-name"]').val();
編輯：如果你想使用一個以上的輸入具有相同name ，使用它像這樣：
$('input[name="input-name"]').forEach(function($in) {
var value = $in.val();
});
在隱藏的輸入框中輸入一個ID，例如hiddenInput。 要訪問該值，可以使用$(.hiddenInput).val(); 。 要訪問服務器端的值，可以使用req.query.id()訪問它
使用$(this)獲取當前表單的隱藏輸入，並且不能對多個元素使用相同的id ，請將id更改為class="options" 。
var val = $(this).find('input:hidden').val());
$(document).on("submit", ".options", function(e) { e.preventDefault(); console.log($(this).find('input:hidden').val()) // gets the value of the submit button });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form class="options"> <input type="hidden" value="104"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form> <form class="options"> <input type="hidden" value="44"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form> <form class="options"> <input type="hidden" value="39"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form>
嘗試這個：
$(document).ready(function() { $("input[type='submit']").click(function(event) { event.preventDefault(); var id = $(this).parent().find("input[name='id']").val(); var action = $(this).data("action"); console.log("action: " + action + ", id: " + id); }); });
<html> <body> <form id="options1"> <input type="hidden" name="id" value="104"> <input type="submit" data-action="delete" value="Delete"> <input type="submit" data-action="reply" value="Reply"> </form> <form id="options2"> <input type="hidden" name="id" value="44"> <input type="submit" data-action="delete" value="Delete"> <input type="submit" data-action="reply" value="Reply"> </form> <form id="options3"> <input type="hidden" name="id" value="39"> <input type="submit" data-action="delete" value="Delete"> <input type="submit" data-action="reply" value="Reply"> </form> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </body> </html>
只需簡單的find獲取所需的數據。
$(document).on("submit", "form", function(e) { alert($(this).find('input[type="hidden"]').val()) e.preventDefault(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <form id="options"> <input type="hidden" value="104"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form> <form id="options"> <input type="hidden" value="44"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form> <form id="options"> <input type="hidden" value="39"> <input type="submit" onclick="this.form.submited=this.value;" value="Delete"> <input type="submit" onclick="this.form.submited=this.value;" value="Reply"> </form>
您需要的是：
<form>
<input type="hidden" name="id" value="104">
<input type="submit" name="action" value="Delete">
<input type="submit" name="action" value="Reply">
</form>
單擊“ Reply按鈕將產生：
id = 104＆action =回復
如何在不提交表單的情況下獲取javascript中輸入字段的值？
[英]How can I get the value of an input field in javascript without submitting a form?
使用GET提交表單時，不要在查詢字符串中包含隱藏字段
[英]Do not include hidden field in query string when submitting form with GET
提交表單后如何讓輸入值顯示在屏幕上？
[英]How can i get the input value to display on the screen after submitting the form?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.