Javascript 如何用CasperJS填充搜索字段

Javascript 如何用CasperJS填充搜索字段,javascript,web-scraping,phantomjs,web-crawler,casperjs,Javascript,Web Scraping,Phantomjs,Web Crawler,Casperjs,我需要在搜索字段中输入“75018”,然后用CasperJS单击搜索按钮。 我提问,并按照说明,我得到了一个调试的屏幕截图,但它没有点击按钮 我试过这个 var x = require('casper').selectXPath; var casper = require('casper').create({ clientScripts: [ 'jquery-1.10.1.min.js' ], pageSettings: {

我需要在搜索字段中输入“75018”,然后用CasperJS单击搜索按钮。 我提问,并按照说明,我得到了一个调试的屏幕截图,但它没有点击按钮

我试过这个

var x = require('casper').selectXPath;

var casper = require('casper').create({
        clientScripts:  [
        'jquery-1.10.1.min.js'
        ],
        pageSettings: {
        loadImages:  true,     
        loadPlugins: true,
        userAgent: 'Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.2 Safari/537.36',
        webSecurityEnabled: false,
        ignoreSslErrors: false,
        sslProtocol: "tlsv1"
    },
    verbose: true,
    logLevel: 'warning'
//    logLevel: 'debug'
});

var utils = require('utils');
var fs = require('fs');
var system = require('system');

casper.options.viewportSize = {width: 1920, height: 1080};
var counter = 0;
var dejaexclu = false;    

function getData(filepath){

  var eol = system.os.name == 'windows' ? "\r\n" : "\n";
  var data = fs.read(filepath);
  //utils.dump(data);
  var arrdata = data.split(eol);
  //utils.dump(arrdata);
  return arrdata;
}

function count(){
  counter = counter +1;
  return counter;
}

casper.start('http://www.chronodrive.com', function() {
   console.log("page loaded");
   this.test.assertExists('form#searchShopForm', 'form is found');
   this.fill('form#searchShopForm', { 
        searchField: '75018'
    }, true);
});
casper.then(function() {
  console.log("photo");

      console.log("photo");
        this.click('#blinksubmit');
        this.captureSelector("screenshot.png", "html");
           console.log("photo"); 
});
casper.run();
我的屏幕截图显示我可以在字段中输入值,但它没有点击

试试这个

this.fillSelectors('form#searchShopForm', { 
        "input[id='searchField']" : "75018"
    }, true);

或者在搜索字段周围加上引号

e、 g

啊,对不起,我看到这是一个自动建议,没有按钮提交的概念。因此,请将true更改为false,然后尝试使用sendkeys发送enter键,例如

编辑

这段代码有效。问题不在于casper,而在于搜索框和动画。这就是事情需要一些时间才能表现出来。casper的golden经验法则是每次您请求新资源/page/script/html/json时,最好使用casper.waitForXXX这允许您等待服务器或动画等所需的时间

var casper = require('casper').create({
    viewportSize : {width: 1920, height: 1080}
});


casper.start('http://www.chronodrive.com/prehome');

casper.waitForText("Pour toutes", function() {

    this.sendKeys('#searchField', '06150 bordeaux', {keepFocus: true});
    this.sendKeys('#searchField', casper.page.event.key.Enter , {keepFocus: true});

});

casper.waitForText("Cannes", function() {
    casper.capture('tmp.jpg');
});

casper.run();

请将输入字段的标记添加到您的问题中。您可以删除屏幕截图。@ArtjomB。我不知道该怎么做,就像你在我的截图中看到的那样,我可以在75018之前填写字段,我只是不能点击“chercher”按钮,谢谢你的编辑,我很累了,但我得到了相同的结果。
var casper = require('casper').create({
    viewportSize : {width: 1920, height: 1080}
});


casper.start('http://www.chronodrive.com/prehome');

casper.waitForText("Pour toutes", function() {

    this.sendKeys('#searchField', '06150 bordeaux', {keepFocus: true});
    this.sendKeys('#searchField', casper.page.event.key.Enter , {keepFocus: true});

});

casper.waitForText("Cannes", function() {
    casper.capture('tmp.jpg');
});

casper.run();