根据另一个字段中的输入自动更新表单字段（只有名称）

Posted 2023-05-09

【中文标题】根据另一个字段中的输入自动更新表单字段（只有名称）

【英文标题】：Automatically update a form field based on input in another field (only got name)

【发布时间】：2018-09-27 02:56:08

【问题描述】：

我是一个完整的初学者，所以在将工作脚本粘贴到我的 WP 设置中几个小时后没有任何结果，我求助。我很绝望，没时间了:(

我正在尝试根据另一个表单域的输入来更新一个表单域（第一个是选择菜单，第二个是常规文本输入）。 这是一个 Wordpress / Woocommerce 安装，其中包含由插件生成的字段，因此我无法控制输出。这些字段只有名称（没有 ID），我找到的所有示例都使用 ID。

表格代码

<select class="addon addon-select" name="addon-8-choose-a-player-0">

                <option value="">None</option>

                <option data-raw-price="200" data-price="200" value="player-1-1">Player 1</option>
                <option data-raw-price="200" data-price="200" value="player-2-2">Player 2</option>
                <option data-raw-price="200" data-price="200" value="player-3-3">player 2</option>

</select>

<input type="text" class="input-text addon addon-custom" data-raw-price="100" data-price="100" name="addon-8-name-100-1[0]" value="">

jQuery 代码

jQuery(document).ready(function( $ ) 

    function onchange() 
        var box1 = $("select[name='addon-8-choose-a-player-0]");
        var box2 = $("#addon-8-name-100-1[0]");
        box2.val(box1.val());
    
    $("select[name='addon-8-choose-a-player-0]").on('change', onchange);
);

【问题讨论】：

应该是var box2 = $("input[name=addon-8-name-100-1[0]]");

感谢您提供快速而有用的答案

【参考方案1】：

也许你正在寻找的东西：

jQuery(document).ready(function( $ ) 

    function onchange() 
        var box1 = $("select[name=addon-8-choose-a-player-0]");
        var box2 = $("input[name*=addon-8-name-100-1]");
      console.log(box1);
            console.log(box2);
        box2.val(box1.val());
    
    $("select[name=addon-8-choose-a-player-0]").on('change', onchange);
);

查看codepen：https://codepen.io/anon/pen/JvPKGj

【讨论】：

首先，感谢您的快速回答Text 的文本？

了解更多信息。你可以在这里查看***.com/a/1107264/3085279

酷，感谢@Tan Duong 的链接。会阅读的。有很多东西要学... :)