1

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

我有一张有用户的桌子。表格的最后一列有一个带有 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();
    });

有什么想法吗?浏览器甚至会允许这样做吗?

4

2 回答 2

1

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

$("#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)
  })
})
.hidden {
  display: none;
}
<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>

于 2016-07-23T17:37:55.917 回答
0

我认为这是解决方法:

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

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

于 2013-09-14T22:05:31.813 回答