Question

我正在尝试接收用户的输入并将其显示为列表。值得庆幸的是，有人已经完成了它并在JSFiddle上找到了它。代码在那里工作正常，但是当我在本地移动它时，它无法正常工作。当我输入文本时，没有任何反应。我在这里遇到了类似的问题，但仍然没有工作。

如果发现错误，请提供建议。谢谢。

<!DOCTYPE HTML>
<html>
    <head>     
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

        <title>List maker</title>
        <style>
            a {
                margin-left: 20px;
                color: maroon;
                text-decoration: none;
                font-weight: bold;
            }
        </style>

        <script>
            $('form').submit(function () {
                if ($('input').val() !== '') {
                    var input_value = $('input').val();
                    $('ul').append('<li>' + input_value + '<a href="">x</a></li>');
            };
                $('input').val('');
                return true;
            });

            $(document).on('click', 'a', function (e) {
                e.preventDefault();
                $(this).parent().remove();
            });
        </script>
    </head>

    <body>
        <form>
            <label>Enter info and press enter</label>
            <input type="text" />
        </form>
        <ul></ul>
    </body>
</html>

Answer 1

由于您的jquery代码位于html之前，我认为将其放在$(document).ready() {}中或将其移至body的末尾会使其再次运行。

代码适用于JSFiddle，但在本地保存时不起作用

1 个答案: