在chrome扩展中使用jquery填写表单时出错?

时间:2014-07-27 16:31:19

标签: javascript jquery html google-chrome google-chrome-extension

我正在尝试使用jquery在chrome扩展程序内的网页中填写表单。这是我的代码: (new.js)

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){ 
 y=tab.url;
         $.get(y, function(data)    //function for parsing the webpage
    {
                          //console.log(data);
                          $(data).find('input').each(function() {
                              //alert("inside");
                              if($(this).attr('id')=="email") {     
                                  alert($(this).attr('id'));
                                  $("#email").val("xxx");
                              } //console.log($(this).text());

                          });
                      });
});

并且网页有很多表单,我想将值填入一个id为id的电子邮件中输入。这是网页的html代码:

<form id="login_form" action="https://www.facebook.com/login.php?login_attempt=1" method="post" onsubmit="return window.Event &amp;&amp; Event.__inlineSubmit &amp;&amp; Event.__inlineSubmit(this,event)">
  <input type="hidden" name="lsd" value="AVq0D9ew" autocomplete="off" />
  <table cellspacing="0">
    <tr>
      <td class="html7magic">
        <label for="email">Email or Phone</label>
      </td>
      <td class="html7magic">
        <label for="pass">Password</label>
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" class="inputtext" name="email" id="email" value="" tabindex="1" />
      </td>
      <td>
        <input type="password" class="inputtext" name="pass" id="pass" tabindex="2" />
      </td>
      <td>
        <label class="uiButton uiButtonConfirm" id="loginbutton" for="u_0_l">
          <input value="Log In" tabindex="4" type="submit" id="u_0_l" /></label>
      </td>
    </tr>
    <tr>
      <td class="login_form_label_field">
        <div>
          <div class="uiInputLabel clearfix uiInputLabelLegacy">
            <input id="persist_box" type="checkbox" name="persistent" value="1" checked="1" class="uiInputLabelInput uiInputLabelCheckbox" />
            <label for="persist_box" class="uiInputLabelLabel">Keep me logged in</label>
          </div>
          <input type="hidden" name="default_persistent" value="1" />
        </div>
      </td><td class="login_form_label_field">
        <a rel="nofollow" href="https://www.facebook.com/recover/initiate">Forgot your password?</a>
      </td>
    </tr>
  </table>
  <input type="hidden" autocomplete="off" name="timezone" value="" id="u_0_m" />
  <input type="hidden" name="lgnrnd" value="225331_eElR" />
  <input type="hidden" id="lgnjs" name="lgnjs" value="n" />
  <input type="hidden" autocomplete="off" id="locale" name="locale" value="en_US" />
</form>

P.S.I对jquery没有多少经验,所以如果这个问题不符合SO的标准,请不要饶我。

这是我的清单文件:

"name": "password",
 "description": "password",
 "version": "0.1",
 "background": {"scripts": ["jquery-1.11.1.js","new.js"], "persistent": false},
 "options_page": "options.html",
 "permissions": ["downloads","tabs","activeTab","history","http://*/", 
        "https://*/","http://ieeexplore.ieee.org/xpl/articleDetails.jsp?arnumber=6645369"],
"content_scripts": [
    {
      "matches": ["http://*/", "https://*/" ],

      "js": ["new.js"]
    }
  ],
 "manifest_version": 2}

4 个答案:

答案 0 :(得分:0)

如何将代码简化为:

 //function for parsing the webpage
$.get(y, function(data)                                                
{
    $("#email").val("xxx");
});

答案 1 :(得分:0)

$("#email").val("xxx");


应该够了

Demo

答案 2 :(得分:0)

我怀疑这就是你想要的:

$.get(y, function(data) {
    var value = $(data).find("#email").text();
    $("#email").val(value);
});

答案 3 :(得分:0)

尝试直接定位指定的元素,在本例中为#email

$("#email").val("xxx");