javascript - Javascript 可以通过编程方式模拟 "keyup"吗？

Question

我有一个带有优惠券文本字段的销售页面。对于我的影响者事件，我为每个新的影响者创建了一张新优惠券。

因为我想让他们的生活更轻松，我编写了一些 javascript 代码，用来自 url 参数的促销代码预填充销售页面的“优惠券”文本字段mysite.com/mysalepage?coupon=NAME_OF_INFLUENCER

但是，人们也可以在没有影响者的情况下到达这个销售登陆页面，并自己输入他们在我们的社交页面某处找到的优惠券代码。

当访问者在文本字段中输入他们的优惠券代码时，它会隐藏价格和付款按钮并显示新价格和新付款按钮。

这些显示/隐藏功能由“Keyup”触发，当访问者输入促销代码时它可以正常工作。

不幸的是，当我的 javascript 代码从我的 url 参数填充优惠券文本字段时，它不起作用。

所以我尝试通过代码在我的页面上创建一些不同的事件并触发它以显示/隐藏促销元素。我试过“滚动、聚焦、聚焦等”……

当我要求这样做时，代码专注于元素，但它不会被我显示/隐藏促销元素的代码触发。

这是我的代码:

< script type = "text/javascript"
language = "Javascript" >
  // Function to hide/show the table based on the values of inputs
  function toggleTable() {


    $('#hideThis').toggle($('#coupon').val() !== 'JDCM' && $('#coupon').val() !== 'PROMOGH2019');
    $('#hideThis3').toggle($('#coupon').val() !== 'JDCM' && $('#coupon').val() !== 'PROMOGH2019');
    $('#showThis').toggle($('#coupon').val() == 'JDCM' || $('#coupon').val() == 'PROMOGH2019');
    $('#showThis2').toggle($('#coupon').val() == 'JDCM' || $('#coupon').val() == 'PROMOGH2019');
    $('#showThis3').toggle($('#coupon').val() == 'JDCM' || $('#coupon').val() == 'PROMOGH2019');
  }

$(document).ready(function() {
  // Bind the keyup event on both the inputs, call the function on event
  $('#coupon').on('keyup', toggleTable).trigger('keyup');
  $('#begin').on('scroll', toggleTable).trigger('scroll');
});


window.onload = function() {

  function querySt(ji) {

    hu = window.location.search.substring(1);
    gy = hu.split("&");

    for (i = 0; i < gy.length; i++) {
      ft = gy[i].split("=");
      if (ft[0] == ji) {
        return ft[1];
      }
    }
  }
  var coupon = querySt("coupon");


  if (coupon == null) {} else {
    document.getElementById('coupon').value = coupon;
  }
}

document.getElementById('coupon').focus();

document.getElementById('begin').focus(); <
/script>

<form>
  <span>Vous avez un code PROMO?</span><input type="text" name="coupon" id="coupon" placeholder="Ex: PROMO2019">
</form>

<div id="showThis">
  <div>
    <b style="color:#000000;">Prix HT:<strike>594€</strike></b>
  </div>
</div>
<div id="hideThis">
  <div>
    <b>Prix HT:594€</b>
  </div>
</div>
<div id="showThis2">
  <div>
    <b>Remise  exceptionnelle de -50%</b>
    <br><br>
    <b style="color:#36C503;">Prix final à payer: 297€</b>
  </div>
</div>
</div>
<div id="hideThis3">
  <div class="div_button">
    <a href="URL_594_euros" class="myButton"><span>&nbsp;</span>&nbsp;Acheter Maintenant 594€</a>
  </div>
</div>
<div id="showThis3">
  <div class="div_button">
    <a href="URL_297_euros" class="myButton"><span>&nbsp;</span>&nbsp;Acheter Maintenant 297€</a>
  </div>
  <div>

在代码中，您可以看到我尝试在滚动事件上显示/隐藏，但没有成功。

我想知道如何通过代码在我的文本字段优惠券上创建此事件“keyup”。

Answer 1

在填写优惠券的代码后，手动触发keyup事件:

$('#coupon').keyup();