Question

我有一个脚本用于使用keyup blur paste将字段复制到另一个输入字段。这个脚本有效，但是我需要修改它以进入两个不同的表单元素，这些元素名为data-cost=""和debt=""，而不是<div id="viewer">

这是我现在拥有的脚本：

$(function () {
    $('#account_balance1').on('keyup blur paste', function() {
        var self = this;
        setTimeout(function() {
            var str = $(self).val();
            $("#viewer").text(str.replace(/^\$/, ''));
        }, 0);
    });

    $("#viewer").text($('#Website').val().replace(/^\$/, ''));
});

这是html：

<!--This where I get the value from -->
<input type="text" class="balance" id="account_balance1" name="cardb" value=""/>

<!--the first 2 elements are where I need the values to go -->
<input data-cost="" debt="" value="" type="checkbox" name="f_2[]"/>

Answer 1

如果您需要将两个属性（数据成本和债务）分别设置为您需要的值：

$("input[data-cost][debt]").attr('data-cost',str.replace(/^\$/, ''));
$("input[data-cost][debt]").attr('debt',str.replace(/^\$/, ''));

Answer 2

然后使用那个选择器

$("input[data-cost][data-debt]")

Answer 3

我认为你可能对数据属性的含义存在根本的误解？您知道他们不会发布表格吗？我认为您正在寻找的是数据功能，它允许您设置数据属性http://api.jquery.com/data/。

也许你想要数据成本和数据债务？

因此，如果您的输入如下：

<input data-cost="" data-debt="" value="" type="checkbox" name="f_2[]" id="checkboxId" />

然后你可以在你的javascript中设置这样的值：

var value1="some value";
var value2="another value";
$('#checkboxId').data('cost', value1);
$('#checkboxId').data('debt', value2);

我不相信拥有一个名为“债务”的属性，因为上面的内容是有效的。

Answer 4

我这样做（setTimeout没用）：

$(function () {
    $('#account_balance1').on('keyup blur paste', function () {
        var self = this;
        var nextCheckbox = $(self).next("input[type='checkbox']");
        var str = $(self).val();
        $("#viewer").text(str.replace(/^\$/, ''));
        nextCheckbox.data({
            cost: str,
            debt: str
        });
        /*
        You won't be able to see changes if you inspect element,
        so just check in console
        */
        console.log(nextCheckbox.data());

});

}）;

您的html标记必须稍加修改：

<!--This where I get the value from -->
<input type="text" class="balance" id="account_balance1" name="cardb" value="" />

<!--the first 2 elements are where I need the values to go -->
<input data-cost="" data-debt="" value="" type="checkbox" name="f_2[]" />

<!--I added the viewer to check if everything works properly -->
<div id="viewer"></div>

键盘功能转换为表单元素

4 个答案: