Question

我正试图刮去颜色和尺寸变化的产品每个变体都是形式，为了获得下一个变体，我点击了单选按钮，它正在对每次点击进行表单提交操作。

我尝试使用

点击它

1. “casper.getElementsInfo(element)[0].click();”
2. “document.querySelectorAll(element)[2].click();”
3. “casper.thenClick('element');”
4. “casper.evaluate(function(){document.querySelectorAll(element)[2].click();});”

每次点击后我都在做一个等待8秒钟的casper！

所以这是我的问题Casperjs在点击下一个颜色/尺寸后出现错误

var casper = require('casper').create({
    viewportSize: {
        width: 1920,
        height: 1080
    },
    pageSettings: {
        loadImages: false,
        loadPlugins: false
    }
});
casper.then(function () {
    self.thenOpen("https://scubapro.johnsonoutdoors.com/fins/fins/seawing-nova-fin-full-foot", function () {
        casper.then(function () {
            var varitoinCount = document.querySelectorAll('div#edit-attributes-field-swatch-taxonomy > div input').length;
            var i = 0;
            casper.repeat(varitoinCount + 1, function () {
                try {
                    document.querySelectorAll('div#edit-attributes-field-swatch-taxonomy > div input')[i].click();
                    casper.log('we got to anhoter variatoin ...' + i);
                } catch (error) {
                    console.log(error);
                }
                i++;
            });

        });
    });
});
try {
    casper.run();
} catch (e) {
    consol.log("Error..... " + e);
}

（TypeError：undefined不是构造函数）

顺便说一下，当我在控制台中做同样的事情时，它可以正常工作

Answer 1

您必须了解在Casper环境中访问DOM 是不可能的。您应该使用Casper的evaluate方法切换到浏览器环境以执行DOM选择器。基本上它用于从浏览器中获取一些信息或用javascript手动执行某些操作。为了理解它，你在官方文档中有专门的部分。

话虽这么说，我修改了你的代码以正确点击不同的颜色变化输入。

var casper = require('casper').create({
  viewportSize: {
      width: 1920,
      height: 1080
  },
  pageSettings: {
      loadImages: false,
      loadPlugins: false
  }
});
casper
.start()
.thenOpen("https://scubapro.johnsonoutdoors.com/fins/fins/seawing-nova-fin-full-foot", function () {
  var varitoinCount = this.evaluate(function() {
    return document.querySelectorAll('div#edit-attributes-field-swatch-taxonomy > div input').length;
  });
  var i = 0;
  this.repeat(varitoinCount + 1, function() {
    this.evaluate(function(iterator) {
      document.querySelectorAll('div#edit-attributes-field-swatch-taxonomy > div input')[i].click();
    }, i);
    i++;
  })
});
try {
  casper.run();
} catch (e) {
  console.log("Error..... " + e);
}

然而它仍然没有改变颜色，因为网站（出于某种原因）需要2次点击才能改变颜色，我建议你输入一些waitFor函数以确保颜色已经改变。

使用Casperjs错误提交表单

1 个答案: