Question

这是我的问题的简化。我想在输入字段后添加一些文本（在更新同一字段时），只有当select元素的值为IT时才会附加。

这是字段：

<select id="billing_country">
    <option value="FR">FR</option>
    <option value="IT">IT</option>
</select>

<input type="text" id="woocommerce_cf_piva">

这是剧本：

jQuery(document).ready(function () {

var $country_select = jQuery('#billing_country');

// When country change
$country_select.change(function () {

    var $country = jQuery('#billing_country option:selected');

    $country.each(function() {

        FieldCheck(jQuery(this).val());
    })
});

function FieldCheck($country) {

    var $element = jQuery('#woocommerce_cf_piva');

    if ($country == 'IT') {

        $element.change(function () {

            $element.after($country);
        });
    }
}
});

你可以see this also on jsFiddle

如果我选择FR，为什么还附加国家名称？

Answer 1

很难理解您尝试对代码执行的操作。

您希望文本输入仅在选择框具有＆＃34; IT＆＃34;选择？

为什么要在文本输入上设置change处理程序？

如果选择了一个选项，为什么要遍历选择框的选项？只需使用所选选项的值设置文本输入，例如

$(function() {
  var $billingCountry = $('#billing_country');

  $billingCountry.change(function() {
    var $country = $('#billing_country option:selected');
    fieldCheck($country.val());
  });

  function fieldCheck(country) {
    var $element = $('#woocommerce_cf_piva');
    if ($country !== 'IT') {
      return;
    }

    $element.val(country);
  }
});

https://jsfiddle.net/davelnewton/w5deffvk/

编辑

更改了命名约定以反映典型的JS
- 非构造函数名称以小写
- 非JQ元素变量无法获得领先$
用作保护子句而不是嵌套逻辑的国家/地区值
- 这段代码很简单，但嵌套可能会让事情更难理解

Answer 2

你有两个问题：

input标记没有onchange个事件;你应该使用onkeydown代替;
您应该在if条件之前分配事件。

Answer 3

我会添加一个跨度并将文本放在那里，以便随后进行更改，您可以修复它：

new Date()

请注意，这仍然非常详细：

<select id="billing_country">
  <option value="FR">FR</option>
  <option value="IT">IT</option>
</select>
<input type="text" id="woocommerce_cf_piva" /><span id="afterit"></span>

以下是总的不太详细的版本：

jQuery(document).ready(function() {
  var $country_select = jQuery('#billing_country');
  var $element = jQuery('#woocommerce_cf_piva');

  // When country change
  $country_select.on('change', function() {
    var $country = jQuery(this).find('option:selected')[0].value;
    var d = ($country == 'IT') ? $country : "";
    $element.data('selectedcountry', d);
  });

  $element.on('change', function() {
    var ct = $(this).data('selectedcountry');
    //as you have it: $(this).after(ct);// append
    // put it in the span to remove/blank out on subsequent changes
    $('#afterit').text(ct);
  });
});

Answer 4

如果我正确理解了问题，您只想在下拉选项为“IT”时使用输入的值更新输入字段。如果是这种情况，您需要在输入字段事件中观察输入字段事件并调用FieldCheck函数。

jquery变量在更新时不会更改

4 个答案: