javascript - 加载窗口上的 jQuery

Question

我有一个javascript代码，javascript代码用于制作字体和颜色预览。因此，您可以选择字体(例如 Arial)和颜色(例如红色)，代码将根据您的选择更改输入框。此选择会自动保存并将其发送到购物车，在购物车中我有一个按钮来编辑您的更改，当我按下该编辑按钮时我的问题就在这里，我回到了我的选择我看不到预览。例如在我按下编辑按钮后，字体必须是宋体，颜色必须是红色。我认为当我返回时 jquery 没有被执行。有办法解决这个问题吗？

这是 jQuery 代码:

jQuery(document).ready(function() {
  jQuery(".product-options dd .font select").change(function() {
    var str = jQuery(this).find("option:selected").text();
    jQuery(".product-options dd input.input-text").css("font-family", str);
  });
  jQuery(".product-options dd .color select").change(function() {
    var str = jQuery(this).find("option:selected").text();
    jQuery(".product-options dd input.input-text").css("color", str);
  });
});

Answer 1

所以你想在页面加载时调用相同的代码。在这种情况下，triggerHandler() 是您的 friend 。见下文:

jQuery(document).ready(function() {
  jQuery(".product-options dd .font select").change(function() {
    var str = jQuery(this).find("option:selected").text();
    jQuery(".product-options dd input.input-text").css("font-family", str);
  });
  jQuery(".product-options dd .color select").change(function() {
    var str = jQuery(this).find("option:selected").text();
    jQuery(".product-options dd input.input-text").css("color", str);
  });

  // add these two lines:
  jQuery(".product-options dd .font select").triggerHandler('change');
  jQuery(".product-options dd .color select").triggerHandler('change');
});