javascript - 选择Pinterest上的所有图像以移至另一 block 板

Question

更新:(2015-10-16)[已解决!]-使用trigger()并通过slice()限制为50个引脚固定。

非常感谢Abhas Tandon通过提供使用

$(this).trigger('click');

代替

$(this).addClass('selected');

它将正确选择图像。我用包含21张图像的电路板进行了测试，效果很好!但是，当尝试移动300多个引脚时，它失败并显示以下错误:

"You can only move 50 Pins at a time." 

然后，我通过使用JavaScript的 slice()函数来仅捕获前50个图像，从而解决了该问题。经过测试，现在可以正常工作。因此，目前的局限性是我一次只能选择和移动50个针脚，但这比必须手动一个接一个地好得多!

最终工作代码:

function checkAll() {
    console.log("Checkboxes count: " + checkBoxes.length);

    $.each(checkBoxes, function(i, v) {
      console.log("Checkbox #: " + i)// + " = " + v);
      $(this).trigger('click');

    });
}

var checkBoxes = $("div > div > div.bulkEditPinWrapper > button");

var checkBoxes = checkBoxes.slice(1, 51);

checkAll();

问题描述:

我正在开发的Pinterest界面(？)脚本(？)遇到了一些麻烦。我是一个程序员，大多是自学成才的，我想我可能缺少一些了解AJAX的关键组成部分吗？这是我第二次尝试编写jQuery脚本以与Pinterest交互。第一个尝试是击败无限滚动功能(又称“加载更多”按钮)，以便将所有图像显示在一页上，从中我可以抓取图像链接，然后使用浏览器插件下载它们以备份我的Pinterest板到我的计算机。我的代码全部正常，除了它实际上并没有最终下载任何图像。

令我失望的是，我暂时搁置了它以专注于其他事情。最终，我重新访问了我的代码并进行了一些挖掘，它应该可以正常工作。我的研究表明，可能阻止我的程序执行我想要的操作的“严重缺陷”与“Pinterest使用AJAX”有关。虽然我知道“带有XML的异步JavaScript”和“XMLHttpRequest”一词，但我在实现AJAX方面并不精通。

用我的最新代码，我写了一个-您会以为-快速的小jQuery脚本来选择所有图像，以便我可以移动它们，删除，复制等。问题是尽管选中了所有复选框可以工作(例如，您必须在板上，然后单击“移动”)，当我第二次单击“移动”按钮时，应该弹出一个模态让您选择要移动到哪个板上，我得到的是

Oops!
Select the Pins you want to move.

使用:

Chrome 45.0.2454.101

Windows 8.1 64位

如何复制问题:

在便携式计算机或台式计算机上登录到您的Pinterest帐户。

选择您的一块评估板或从头开始构建测试板(这样就不会松动任何当前的引脚)。

单击右上 Angular 的“移动”。这将使透明的复选框出现在每个图像的右上 Angular 。注意:Pinterest会显示其未选中的复选框，其中已经带有复选标记。您知道复选框已被选中的方式是，它保留复选标记，并且复选框背景变为稳定的红色(不再是透明的)。

在浏览器中，启动开发人员工具控制台(Firefox/Chrome:F12)。

将以下脚本添加到浏览器的JavaScript控制台中。

运行脚本。如果它“工作”，您应该会看到所有复选框现在都是红色的。

再次单击“更多”按钮。现在，您将获得“选择要移动的销钉”。消息，表明实际上全选不起作用。

注意:目前我不关心分页，但是如果有人想解决这个问题，我也愿意就此问题寻求解决方案。



脚本选择所有图像:

/* 
   @Repo:     EHW-JavaScript-Pinterest-SelectAllImages.

   @Creator:  Eric Hepperle (CodeSlayer2010/CodeWizard13)
   @Date:     10/15/15
   @Version:  1.0

   @Purpose:  Click "Move" in Pinterest board to move pins.
              Once checkboxes are visible, run this in an
              F12 browser console to automatically check all
              visible image pins. You will have success when
              the color of all checkboxes turns red. Then
              click "Move" again to finish.

    @Notes:
        2015.10.15
            - Created script.
            - Checks all checkboxes, but does not allow moving.

*/

function checkAll() {
    console.log("Checkboxes count: " + checkBoxes.length);

    $.each(checkBoxes, function(i, v) {
      console.log("Checkbox #: " + i)// + " = " + v);
      $(this).addClass('selected');

    });
}

//$(document).ready(function() {
    alert('hi');

    var checkBoxes = $("div > div > div.bulkEditPinWrapper > button");

    checkAll();
//});

我已尝试解决的问题:

用Google搜索解决方案。我找到了以下文章。最后一个似乎是我需要的，但似乎没有足够集中于我的问题。

StackOverflow | jQuery to add a class to image links without messing up when the link passes variables

Quora | Pinterest User Feedback: Can you provide options to "select multiple pins and pin them into a board" or "to pin an image into multiple boards at a time"?

StackOverflow | Identify & Extract the title/description of an Image (Data Scraping Pinterest)

StackOverflow | Get all images from a board from a Pinterest web address

最初尝试将每个复选框的“checked”属性设置为“true”，但最终并未选中该复选框(为什么？)。但是，然后我在浏览器控制台中观察到，当我单击以选择图像时，“选定”类将应用于该图像。因此，我使用addClass()将该类应用于代码中的所有复选框，然后我就能够使所有复选框正确选择，然后……似乎如此。

我尝试了对$(document).ready的调用的代码，但是它给了我错误

"Uncaught ReferenceError: checkBoxes is not defined(…)"

我花了我一整天的时间来格式化它……在此先感谢您的帮助。我很高兴澄清是否有不清楚的地方。另外，请让我知道此帖子是否属于其他论坛。谢谢。

Answer 1

我尝试在每个元素上触发click事件，它对我来说非常有效。无法在滚动中尝试，因为我的板上没有那么多图像。

function checkAll() {
    console.log("Checkboxes count: " + checkBoxes.length);
    $.each(checkBoxes, function(i, v) {
        console.log("Checkbox #: " + i) // + " = " + v);
        $(this).trigger('click');
    });
}
var checkBoxes = $("div > div > div.bulkEditPinWrapper > button");
checkAll();

请让我知道这对你有没有用。