Question

我正在尝试使用在提交表单时在文本字段中输入的值设置隐藏表单字段的值。

我已经尝试将各种问题的答案结合起来，但我最接近的是得到了＃id;＆＃39;我的源字段 - 但不是值。

文字字段名称= wpcf-available-stock 隐藏字段名称= wpcf-total-stock

隐藏字段只需要设置为与使用Jquery提交的表单上的文本字段相同的值吗？

我似乎无法在其他问题中找到一个简单的样本...谢谢

Answer 1

要获得预期结果，请使用以下内容 HTML：

<input  type="hidden" name="wpcf-total-stock">
<input  type="text" name="wpcf-available-stock" value="test">

JS：

$("input[name='wpcf-available-stock']").on('keyup',function(){
$("input[name='wpcf-total-stock']").val($(this).val());
alert($("input[name='wpcf-total-stock']").val());
});

Codepen- http://codepen.io/nagasai/pen/RRBwjA

Answer 2

首先：为什么要在文本字段中填写隐藏的表单字段呢？

其次，jQuery看起来像这样：

var fieldValue = $('#wpcf-available-stock').val();
$('#wpcf-total-stock').val(fieldValue);

你显然可以将它们连在一起，但这很干净。

以下是演示：https://jsfiddle.net/u5Lj8cLz/

Answer 3

纯JavaScript解决方案。

    updateHidden = function(x) {
      document.querySelector("[name=bar]").value = x;
    }

    <input name="foo" value="" onchange="updateHidden(this.value)" type="text">
    <input name="bar" value="sometext" type="hidden">

<强>更新

updateHidden = function() {

document.querySelector("[name=bar]").value = document.querySelector("[name=foo]").value;
}


document.querySelector("[name=foo]").addEventListener("change", updateHidden);

/*
or, 
document.querySelector("[name=foo]").addEventListener("keyup", updateHidden);
*/

        <input name="foo" type="text">
        <input name="bar" type="hidden">

使用textfield中的值更新隐藏的表单字段

3 个答案: