Question

我正在尝试提交表单。当我使用firefox时，页面将被加载然后我打开firebug我可以看到一个名为＆＃34; content_html＆＃34; 的输入字段但是当我去检查页面的来源时< em>＆＃34;查看页面来源＆＃34; 我没有看到输入字段＆＃34; content_html＆＃34; 。我进一步检查，发现有一个javascript将在浏览器中加载，以显示输入字段。代码就像

geteditorinit("http://example.com/pub","data[content_html]",298996,1,750,350,0,0,"content_html");

所以我可以得出结论，当我访问包含此表单的页面时，只有在执行此javascript代码后才会加载＆＃34; content_html＆＃34; 隐藏的输入字段。我需要为此输入字段分配一些值才能提交表单。由于我无法获得被操纵的Javascript HTML，就像我在浏览器中获得的那样，使用CasperJs我无法使用CSS选择器为其分配任何值。因为CSS选择器没有找到这个隐藏的输入字段。如何使用它包含的javascript加载页面，以便我可以像firebug一样获取HTML，向我显示输入字段以便能够提交它？登录后，我转到包含我想要提交的表单的页面

casper.thenOpen(POST_URL, function(){
          //Here I type the code to fill the form
});

P.S。 [1] 如果PhantomJS是一个完整的浏览器而且我不需要运行Javascript那么为什么我不能用CSS选择器获取这个隐藏的输入字段？ enter image description here
上图来自 Firebug 。如您所见，它以无色模式显示输入字段。我希望能够选择＆＃34; content1_html＆＃34; 并为其设置值，然后提交我的表单。
P.S。 [2] 我发现当我加载发布页面时，它会单独向另一个页面发出ajax请求，以自动保存＆＃34; content1_html＆＃34; 的内容。我需要打开发布页面，向＆＃34; content_html＆＃34; 发送请求到另一个页面，之后单击我已经加载的页面上的提交。我可以制作另一个标签或打开另一个网址而不会丢失我已有的数据吗？因为每次刷新后，表单令牌都会被更改，我将无法成功提交帖子。

Answer 1

有多种方法可以选择该元素。您可以尝试以下CSS选择器，它们可以工作，具体取决于页面上的元素：

"input[name = 'data[content1_html]']"基于确切的名称属性匹配
"input[id ^= 'hdndata[content1_html]']"基于id属性的开头

现在，要更改该值，您需要使用casper.evaluate()，因为DOM只能通过此函数访问，而CasperJS不为此情况提供任何便利功能。它是沙盒的，因此您需要显式传递值。

casper.evaluate(function(selector, value){
    document.querySelector(selector).value = value;
}, selector, value);

可能需要等到页面中出现输入字段：

casper.waitForSelector(selector, function then(){
    this.evaluate(function(selector, value){
        document.querySelector(selector).value = value;
    }, selector, value);
    // Do something to submit the form
});

如果在提交表单之前将此隐藏输入添加到DOM就足够了，以下是此代码：

casper.evaluate(function(value){
    var parent = document.querySelectorAll(".rteDiv")[1];

    // get dynamic ID
    var id = parent.querySelector("[id ^= 'Buttons1_']").id.replace("Buttons1_rte", "");

    var input = document.createElement("input");
    input.type = "hidden";
    input.id = "hdndata[content1_html]_" + id;
    input.value = value;
    input.name = "data[content1_html]";

    parent.appendChild(input);
}, value);

我假设第二个.rteDiv是您要使用的那个，因为另一个是演示。

使用CasperJs加载页面时加载页面的Javascript

1 个答案: