Javascript $（文档）.ready（函数（））不工作_Javascript_Jquery_Html_Css

Javascript $（文档）.ready（函数（））不工作

javascript jquery html css

Javascript $（文档）.ready（函数（））不工作,javascript,jquery,html,css,Javascript,Jquery,Html,Css,从技术上讲，我试图从select元素自动创建tab。这是分开的，就像这样 <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script type="text/javascript"> $(document).

从技术上讲，我试图从select元素自动创建tab。这是分开的，就像这样

<!DOCTYPE html>
<html>

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("select").change(function() {
            document.getElementById(1).focus();
        });
    });
    </script>
</head>

<body>
    <select name="" id="eventChoose" class="cuSelect">
        <optgroup label="Friends & Family Events">
            <option>Birthday Party</option>
            <option>Anniversary Party</option>
            <option>New Born Party</option>
            <option>Bachelors Party</option>
            <option>Kitty Party</option>
        </optgroup>
        <optgroup label="Corporate Party">
            <option>Team Outing</option>
            <option>Product Launch Party</option>
            <option>Recognition Party</option>
            <option>Network Event</option>
            <option>Seminars</option>
        </optgroup>
        <div>
            <input type="text" id="1">
        </div>
</body>

</html>

但是当我把这个代码放在我网站的主代码中时，它就停止工作了

<!DOCTYPE html>
<html lang="en" class="enhanced">

<head>
    <meta charset="utf-8">
    <meta name="HandheldFriendly" content="True" />
    <meta name="MobileOptimized" content="300" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,       user-scalable=0">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="eventila-web/resources/css/styles.css">
    <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700' rel='stylesheet' type='text/css'>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#eventChoose").change(function() {
            document.getElementById(budget).focus();
        });
    });
    </script>
</head>

<body>
    ....

谁能告诉我可能是什么问题吗？我对javascript相当陌生

谢谢您的帮助。

您的代码中还没有定义jquery。加上这个

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

不能将整数用作id

还可以使用jquery方法

<input type="text" id="a1">

$('#a1').focus();

见下面我的评论。您还没有包括jQuery脚本，也不清楚预算是多少。在第二个示例中显示的代码中，您可能会收到未定义变量预算的ReferenceError。您的第一个代码示例使用了1，它与getElementById一起工作，但很难与带有jQuery的CSS选择器一起使用。您必须以不明显的方式对其进行转义：

<head>
    ...

   <!-- You didn't include jquery -->
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <script type="text/javascript">
    $(document).ready(function() {
        $("#eventChoose").change(function() {
            // I don't see budget defined anywhere. Is it an id? 
            $('#budget').focus();
        });
    });
    </script>
</head>

无论使用何种技术，id都是字符串，因此需要将id括在引号中。在第二个示例中，您使用的是document.getElementByIdbudget。这将不起作用，因为未定义的id无效。您可以调用document.getElementByIdbudget，这将起作用。

我添加了jquery方法..，budget是我使用的文本框的id。对不起，我刚才忘了提那件事。但问题解决了。我在主html文件中包含了脚本，而我有一个单独的js文件。所以我的脚本函数大部分被另一个函数覆盖。我在主js文件中添加了我的函数，并将其从主html中删除。它成功了。

谢谢你的帮助

你不工作是什么意思？元素没有聚焦？控制台中有错误吗？如果打开控制台，您可能会看到预算未定义错误预算变量在第二段代码中包含什么？您刚刚删除了第二段代码中的jquery.js引用吗？叹口气然后运行。安查，堆栈溢出是一个非常活跃的地方，人们会对你的问题大发雷霆。发帖后，最好在几分钟内回答问题等。实际上，您可以根据DOCTYPE进行选择，但这不是一个好主意。在HTML5中，您可以不使用整数作为id，尽管它们仍然应该在GetElementById中使用字符串引用，事实上，尽管早期版本的HTML限制更大，浏览器从来都不是。使用CSS选择它们仍然是一件痛苦的事情，尽管：$\\31.focus正如Rory所说，如果必须使用前导数字，最好使用getElementById。使用数字是可以的，但是对于getElementById，它只是被强制为字符串。您的编辑更正了使用整数不起作用的语句。var预算=1；document.getElementByIdbudget；会很好用的。我们不知道OP在这段代码中试图做什么。是的，但是，如果budget是元素的id，而不是变量，那么它们肯定需要引号。我添加了jquery方法..，budget是我使用的文本框的id。对不起，我忘了提那件事了。但问题解决了。我的脚本函数大部分被另一个函数覆盖。我在主js文件中添加了我的函数，并将其从主html中删除。