Question

Chrome扩展程序无效，这是我的代码......

//的manifest.json

{
    "manifest_version": 2,
    "name": "auto login",
    "description": "With this extension you can auto login.",
    "version": "1.0",
    "permissions": [ "http://*/*" ],

    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    }
}

// popup.html

<!DOCTYPE HTML>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $('#submit').click(function(){
                var data = document.getElementById("username").value;
                localStorage["username"] = data;
            });
        });
</script>
    <title>Hello World!</title>
</head>
    <body>
        <form name="login">
            <fieldset>
                <legend>Log In</legend>
                <table>
                    <tr>
                        <td><label for="username">Username</label></td>
                        <td><input type="text" name="username" id="username"/></td>
                    </tr>
                    <tr>
                        <td><label for="password">Password</label></td>
                        <td><input type="password" name="password" id="password"/></td>
                    </tr>
                    <tr>
                        <td><input type="submit" value="verzenden" name="submit" id="submit"/></td>
                    </tr>
                </table>
            </fieldset>
        </form>
    </body>
</html>

为什么这段代码不起作用？使用此脚本无法保存用户名和密码的值。有人可以帮助我吗？

Answer 1

永远不要在表单提交中调用任何内容
返回false或致电preventDefault以不提交表单

为表单提供ID并从提交按钮中删除名称和ID

$(document).ready(function(){
    $('#login').on("submit",function(e){
        var data = document.getElementById("username").value;
        localStorage["username"] = data;
        e.preventDefault();
    });
});

Answer 2

您必须从那里删除form标记。当您单击按钮时，表单将自动提交，您的功能无法运行

chrome扩展 - 提交值不起作用

2 个答案: