Javascript 如何查找字段名并填充其值？

我有以下用于登录应用程序的HTML表单： 我只对表单的“username”和“pwd”字段元素感兴趣

<form name="loginForm" METHOD="post"
    ACTION="/arsys/servlet/LoginServlet"
        enctype="x-www-form-encoded">
    <tbody>
    <tr>
        <td class="login" nowrap="nowrap" width="20px">&nbsp;</td>
        <td class="login" colspan="2" nowrap="nowrap">
        <em class="subhead">Please log in.</em>
        </td>
    </tr>
    <tr>
        <td class="login" nowrap="nowrap" width="20px" >&nbsp;</td>
        <td class="login" nowrap="nowrap" id="LoginLabel-id">
            <b><label style="color:#FFFFFF;" for="username-id">User Name</label></b>
        </td>
        <td>
        <input name="username" maxlength="254" id="username-id" value="" class="loginfield" size="30" type="text">
        </td>
    </tr>
    <tr>
        <td class="login" nowrap="nowrap" width="20px">&nbsp;</td>
        <td class="login" id="PasswordLabel-id" nowrap="nowrap">
            <label style="color:#FFFFFF;" for="pwd-id">Password</label>
        </td>
        <td>
        <input name="pwd" maxlength="61" id="pwd-id" class="loginfield" size="30" autocomplete="off" type="password">
        </td>
    </tr>
    <tr>
        <td class="Login" nowrap="nowrap" width="20px">&nbsp;</td>
        <td class="Login" name="auth_label" nowrap="nowrap">
            <label style="color:#FFFFFF;" for="auth-id">Authentication</label>
        </td>
        <td><input type="text" NAME="auth" id="auth-id" maxlength="2048" class="loginfield" size="30"></td>
    </tr>                           
    <tr>
        <td class="Login" nowrap="nowrap" width="20px">&nbsp;</td>
        <td class="loginfield" nowrap="nowrap">&nbsp;</td>
        <td>
            <input type="button" name="login" value="Log In" onClick="doLogin();"><!--;-->&nbsp;
            <input type="button" name="clear" value="Clear" onClick="clearLogin();"><!--;-->
        </td>
    </tr>
    <tr>
        <td class="Login" nowrap="nowrap">&nbsp;</td>
        <td class="Login" nowrap="nowrap">&nbsp;</td>
        <td>
            <input type="hidden" name="timezone" value="">
            <input type="hidden" name="encpwd" value="1">
            <input type="hidden" name="goto" value="" >
            <input type="hidden" name="server" value="" >
            <input type="hidden" name="ipoverride" value="0">
            <input type="hidden" name="initialState" value="-1">
            <input type="hidden" name="returnBack" value="">
        </td>
    </tr>
</tbody>
</form>

var utils = require('utils');
var casper = require('casper').create({   
    verbose: true, 
    logLevel: 'debug',
    pageSettings: {
         loadImages:  false,         // The WebPage instance used by Casper will
         loadPlugins: false,         // use these settings
         userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4'
    }
});

// print out all the messages in the headless browser context
casper.on('remote.message', function(msg) {
    this.echo('remote message caught: ' + msg);
});

// print out all the messages in the headless browser context
casper.on("page.error", function(msg, trace) {
    this.echo("Page Error: " + msg, "ERROR");
});

// LOG IN.
var login_url = 'https://usms.upc.biz/arsys/shared/login.jsp';
casper.start(login_url, function() {
   this.test.assertExists('form[name="loginForm"]', 'form is found');
   // utils.dump(this);
   this.fill('form[name="loginForm"]', { 
        'input[name="username-id"]': 'SNIP!', 
        'input[name="pwd"]':  'SNIP!'
    }, true);
});

casper.run();

但是我错误地引用了字段，我无法找到如何列出所有字段名以及如何访问它们：

PASS form is found
[info] [remote] attempting to fetch form element from selector: 'form[name="loginForm"]'
[error] [remote] findAll(): invalid selector provided "[name="input[name="username-id"]"]":Error: SYNTAX_ERR: DOM Exception 12
[error] [remote] findAll(): invalid selector provided "[name="input[name="pwd"]"]":Error: SYNTAX_ERR: DOM Exception 12
CasperError: Errors encountered while filling form: no field named "input[name="username-id"]" in form; no field named "input[name="pwd"]" in form

您能告诉我如何设置这两个输入字段吗，

---

然后调用

onClick=“doLogin（）；

？

，假设您使用的是当前最新的casperjs 1.1

如果需要指定元素

名称

s：

this.fill('form[name="loginForm"]', {
    'username': 'SNIP!',
    'pwd':  'SNIP!'
}, true);

您还可以通过id使用和定位两个输入：

---

更新和更新Artjom B的所有学分

您应该使用以下命令等待

用户名

输入

出现在DOM中：

等待远程DOM中存在与提供的选择器表达式匹配的元素，以处理任何下一步

---

PASS form is found TypeError:“undefined”不是一个函数（计算“this.fillSelectors”（'form[name=“loginForm”]，{'input#username id'：'SNIP！'，'input#pwd id'：'SNIP！'，true））（找到表单后，你知道为什么它是空的吗？@Nikoskalis你在使用哪个casperjs版本？（答案假设你在1.1上）Thank.PASS form在尝试从选择器获取表单元素时被发现[info][remote]：“form[name=“loginForm”]”CasperError:填写表单时遇到错误：表单中没有名为“username”的字段；formCasperJS版本1.0.2中没有名为“pwd”的字段，位于/home/nskalis/n1k0-casperjs-76fc831，使用PhantomJS版本1.9.0

this.fillSelectors('form[name="loginForm"]', {
    'input#username-id': 'SNIP!',
    'input#pwd-id':  'SNIP!'
}, true);

casper.waitForSelector("#username-id", function() { 
    this.fill('form[name="loginForm"]', { 
        'username': 'SNIP!', 
        'pwd': 'SNIP!' 
    }, true); 
});