javascript - 根据选择选项隐藏/显示动态生成的 div

Question

我有一些由 jquery 生成的 div。里面显示了价格、标题和所选选项的值。

如果没有选择任何选项，我尝试了很多方法来隐藏每个 div 类“结果”，但没有运气。

有没有办法隐藏每个div而不重写整个代码？

JS:

function pcc_calc_forms() {
  jQuery(".calcolare").each(function (e) {
    var t = jQuery(this).attr("id");

    var n = pcc_form_data(t);
   jQuery("#" + t + "-mostra").html('<h3 class="pcc-total">Totale : ' + n[0] + "" + "€" + '</h3><div class="content">' + n[1] + '<br /><br /></div>')
  })
}

function pcc_form_data(e) {
  var t = new Array(0, "");
  var n = new Array;
  var r = new Array;

  $("#" + e + " select").each(function (e) {
    var title = $(this).attr("data-title");
    var inside = $(this).find("option:selected").attr("data-title");
    var i = $(this).find("option:selected").html();

    if (inside === undefined) {
      inside = " ( " + i + " ) "
    } else {
      inside = " ( " + inside + " ) "
    }

    var i = $(this).find("option:selected").attr("data-price");
    var s = parseFloat($(this).attr("data-mult"));

    if (isNaN(s)) {
      s = 1
    }
    var o = parseFloat($(this).find("option:selected").text());
    if (isNaN(o)) {
      o = 0
    }

    if (i !== undefined) {
      if (i == "this") {
        i = o
      } else {
        i = parseFloat(i)
      }

      t[0] = t[0] + parseFloat(i) * s;

      if (s == 1) {
        t[1] = t[1] + "<div class=\"result\"><b>" + title + "" + inside + "</b> : " + parseFloat(i) + "" + " € " + "</div>"
      } else {
        t[1] = t[1] + "<div class=\"result\"><b>" + title + "" + inside + "</b> : " + parseFloat(i) + " X " + s + " = " + parseFloat(i) * s + "" + " € " + "</div>"
      }
    }
  });

  n = [];
  r = [];

  return t
}

$(document).ready(function () {
  pcc_calc_forms();

  $(document).on("change", ".calcolare select", function () {
    pcc_calc_forms()

  });
});

THIS是 fiddle 的链接

预先感谢您的任何提示。

Answer 1

$(document).on("change", ".calcolare select", function () {
  var i = $(this).find('option:selected').index();  
  alert(i);
  //if(i>0) ppc_calc_forms();
  //else $('.results').hide();
})

这将找到所选选项的索引... as you can see ，它可以工作，只是不符合你的功能......

我会尽可能简化该脚本..