Question

我在td标签内有一个模态。

一旦用户选择了所需的颜色并关闭了模态，它将影响定价。

价格受您选择的颜色数量影响。

如果您打开模态并选择例如2种颜色并将其关闭。它不会触发on change事件。

要触发事件，您必须再次更改宽度或放置输入。

我不确定如何触发更改。

请帮助！

这是我所拥有的：

HTML：

<tr>

  <td>
    <input type="text" name="width[]" class="width">
  </td>

  <td>
    <input type="text" name="drop[]" class="drop">
  </td>

  <!-- Button trigger modal -->
  <td>
    <button type="button" class="features btn btn- 
   primary" data-toggle="modal" data- target=".featuresModal">Features
    </button>

    <!--modal -->
    <div class="featuresModal modal fade" tabindex="-1" role="dialog" aria- labelledby="featuresModalLabel" aria-hidden="true">

      <div class="modal-dialog" role="document">
        <div class="modal-content text-center">
          <div class="modal-body">
            <div class="text-centre">
              <select data-placeholder="Colours" class="colours 
   chosen-select" multiple tabindex="4" name="colours[]">" +
                <option value=\ "\"></option>
                getMultiColours() +
              </select>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="trigger btn btn- 
   secondary" data-dismiss="modal">Save and Close
            </button>
          </div>
        </div>
      </div>
    </div>
  </td>
</tr>

js：

$(document).on('change', '.colours, .width, .drop', function () {
    var width = $(".width", $(this).parent().parent()).val();
    var drop = $(".drop", $(this).parent().parent()).val();
    var sub_total = $(".total",$(this).parent().parent());
    var colours = $(".colours",$(this).parent().parent()).val();
    var colour_count = colours.length;

    $.ajax({
        url: "#",
        method: "POST",
        data: {
            "product": product,
            "width": width,
            "drop": drop
        },
        success: function (data) {
            data = parseInt(data);

            if (data === "") {
                parent = sub_total.val(0);
            }
            else {
                var price = 0;
                if (colour_count <= 1) {
                    parent =
                        sub_total.val(data);
                }
                else if (colour_count <= 2) {
                    data = data + (data * 0.15);
                    parent =
                        sub_total.val(data);
                }
                else {
                    data = data + (data * 0.15);
                    for (i = 2; i <
                        colour_count; i++) {
                        data += (data * 0.10);
                    }
                    parent = sub_total.val(data);
                }
            }
            calculate(parent)
        }
    });
});

Answer 1

我有一个可行的解决方案。

$(document).on('hidden.bs.modal', '.featuresModal', function() 
  {
    get pricing...
  }

在模态中输入的值不会在文档js

1 个答案: