gpt4 book ai didi

javascript - 从一个输入到另一个输入动态生成值

转载 作者:行者123 更新时间:2023-11-30 15:58:00 25 4
gpt4 key购买 nike

我正在尝试使用 jQuery 将我的一个输入标签动态复制到另一个输入标签中。换句话说,当用户输入第一个输入时,第二个输入显示用户输入的内容(仅当复选框被选中时)。

仅当在第一个输入中输入内容并选中该框时,第二个输入才应显示

fiddle 链接: https://plnkr.co/edit/GI8jWqh6PbMKO7HVhikP?p=preview

这是我目前所拥有的:

<body>
<input type="password" id="firstInput" />
<input type="hidden" id="secondInput" />
<br/>
<input type="checkbox" id='checkbox'/>

<script>
$('#checkbox').change(function(){
if ($(this).prop('checked')) {
$(secondInput).prop('type', 'text');
$(firstInput).on('input', function () {
$(secondInput).val($(firstInput).val());
});
} else {
$(secondInput).prop('type', 'hidden');
}

});
</script>

然而,这种工作,我面临着以下问题:

1.如果我将复选框默认为“已选中”,jQuery 将看不到更改事件,因此如果我开始输入,第二个输入将不会显示任何内容。

2.当我开始打字时,第二个输入出现了。如果我删除 firstInput 中的所有内容,secondInput 将不会隐藏。

3. 与第二个问题类似的问题。如果我将复选框的选中属性默认为 false,如果我将其更改为选中,隐藏的输入就会显示出来,即使我没有输入任何内容。

4.如果我不选中复选框,然后开始输入内容,如果我将复选框更改为选中,则第二个输入将不会显示我输入的内容,因为之后发生了 change() 事件。

建议?

最佳答案

我认为这符合您的要求。

它只对复选框和主输入使用一个事件处理程序

  var $check = $('#4').change(updateSlave),
$slave = $('#secondInput'),
$master = $('#firstInput').on('input', updateSlave);


function updateSlave(){
var showSlave = $master.val() && $check.is(':checked');
// not sure about value when hidden
$slave.prop('type', showSlave ? 'text' : 'hidden').val(showSlave ? $master.val() : '')

}

DEMO

关于javascript - 从一个输入到另一个输入动态生成值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38193421/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com