Question

我开始认为这可能甚至不可能，但我正在尝试通过允许一次启动多个电子邮件来自动执行后端管理任务。

我有一个用户表。该表的最后一列有一个带有mailto链接的下拉按钮，可以向该行的用户发送各种电子邮件。该列旁边还有一个复选框。这是一个简化的片段：

  <table>
    <tr>
      <td>
        User
      </td>
      <td>
        <div class="btn-group individual-btn">
          <a class="btn btn-default dropdown-toggle" href="#" data-toggle="dropdown">
            Email User
          <ul class="dropdown-menu">
            <li>
              <a class="no-open" href="mailto:user?subject=why&body=etc">
                Why didn't you open?
              </a>
              <a class="no-open" href="mailto:user?subject=why&body=etc">
                Why didn't you click?
              </a>
              <a class="no-open" href="mailto:user?subject=why&body=etc">
                Why didn't you pay?
              </a>
          </ul>
        </div>
        <input type="checkbox" class="selected-row">
      </td>
    </tr>
    <tr>
      rinse and repeat...

在表的末尾，我有一个按钮，其中包含相同的操作集，但是此按钮的想法是单击它将为每个选定的用户打开一个电子邮件（如复选框所示）。

    <div class="btn-group master-btn">
      <a class="btn btn-default dropdown-toggle" href="#" data-toggle="dropdown">
        Email All Checked Users
      <ul class="dropdown-menu">
        <li class="email-items">
          <a class="no-open" href="#">
            Why didn't you open?
          </a>
          <a class="no-open" href="#">
            Why didn't you click?
          </a>
          <a class="no-open" href="#">
            Why didn't you pay?
          </a>
      </ul>
    </div>

我认为js可能很容易：

    $(".master-btn .email-items a").click(function(e){
      linkClass = "a." + $(this).attr("class").trim()
      $(".selected-row:checked").prev(".individual-btn").find(linkClass)[0].click();
      e.preventDefault();
    });

但是只打开了第一个选定行的电子邮件。所以，我想，也许dom需要在这些点击之间留出空间，所以我会迭代每一个并延迟模拟点击;但结果相同：只有第一个选定的行通过电子邮件发送：

    $(".master-btn .email-items a").click(function(e){
      linkClass = "a." + $(this).attr("class").trim()
      $(".selected-row:checked").each(function(i){
        var self = this
        setTimeout(function(){
          $(self).prev(".individual-btn").find(linkClass)[0].click();
        }, 2000*i);
      });
      e.preventDefault();
    });

有什么想法？浏览器是否会允许这个？

Answer 1

我认为这是解决方法：

$(".selected-row:checked").prev(".individual-btn").find(linkClass).each(function() {
    $(this)[0].click();
});

在jQuery对象上使用[0]时，它只返回集合中的第一个DOM元素，相当于.get(0)。如果你想要一个包含所有DOM元素的数组，你必须使用.get()（没有参数它会返回所有元素）。

Answer 2

工作示例：https://jsfiddle.net/gaboom/h81qov5g/

＆＃13;

$("#send").on("click", function(event) {
  event.preventDefault();
  $("#iframes").empty();
  $("#links a").each(function() {
    setTimeout($.proxy(function() {
      var popup = window.open($(this).attr("href"))
      setTimeout($.proxy(function() {
        this.close();
      }, popup), 100);
    }, this), 100)
  })
})

＆＃13;

.hidden {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a id="send" href="#">CLICK TO SEND</a>
<div id="links" class="hidden">
  <a href="mailto:john@example.com">John</a>
  <a href="mailto:sarah@example.com">Sarah</a>
  <a href="mailto:john@example.com">John</a>
  <a href="mailto:sarah@example.com">Sarah</a>
  <a href="mailto:john@example.com">John</a>
  <a href="mailto:sarah@example.com">Sarah</a>
</div>

＆＃13;

使用jquery触发多个mailto链接

2 个答案: