我的 jquery 单选按钮出了什么问题？

发布于 2024-09-18 08:15:14 字数 662 浏览 1 评论 0原文

你好，我是 jquery 新手，请告诉我我的代码出了什么问题

   <html>
<head>
<title>jQuery Hello World</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<script type="text/javascript">
$("input[@name='chkBox']").click(function(){
    if ($("#chkBox"]:checked").val() == 'a')
        // Code for handling value 'a'
  {
  $("#msgid").html("This is Hello World by JQuery");
  }

});

</script>
<body>
<input type="radio" name="chkBox" id="chkBox" value="a" />
<div id="msgid">
</div>
</body>

原文

hello i am new to jquery can any one please tell me what's wrong with my code

   <html>
<head>
<title>jQuery Hello World</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<script type="text/javascript">
$("input[@name='chkBox']").click(function(){
    if ($("#chkBox"]:checked").val() == 'a')
        // Code for handling value 'a'
  {
  $("#msgid").html("This is Hello World by JQuery");
  }

});

</script>
<body>
<input type="radio" name="chkBox" id="chkBox" value="a" />
<div id="msgid">
</div>
</body>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

山川志 2024-09-25 08:15:14

你的剧本里有很多错误的地方。

将复选框点击函数封装在 $(document).ready( function() { } ) 中，否则稍后将无法看到复选框被添加到 DOM 中。
请检查您的网络浏览器的错误控制台以捕获其他错误。

固定脚本：

<html>
    <head>
        <title>jQuery Hello World</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

        <script type="text/javascript">
            $(document).ready(
                function() {
                $("#chkBox").click(
                    function() {
                        if ($("#chkBox:checked").val() == 'a') {
                            // Code for handling value 'a'
                            $("#msgid").html("This is Hello World by JQuery");
                        }
                    }
                );                                                                                                                                           
                }                                                                                                                                            
            );                                                                                                                                               
        </script>                                                                                                                                            
    </head>                                                                                                                                                  

    <body>                                                                                                                                                   
        <input type="radio" name="chkBox" id="chkBox" value="a" />                                                                                           
        <div id="msgid">                                                                                                                                     
        </div>                                                                                                                                               
    </body>                                                                                                                                                  
</html>

You have quite a few things wrong in the script.

Wrap the checkbox click function within a $(document).ready( function() { } ) as otherwise it will not be able to see the checkbox being added to the DOM later.
Please check the error console of your web browser to catch other errors.

Fixed script:

<html>
    <head>
        <title>jQuery Hello World</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

        <script type="text/javascript">
            $(document).ready(
                function() {
                $("#chkBox").click(
                    function() {
                        if ($("#chkBox:checked").val() == 'a') {
                            // Code for handling value 'a'
                            $("#msgid").html("This is Hello World by JQuery");
                        }
                    }
                );                                                                                                                                           
                }                                                                                                                                            
            );                                                                                                                                               
        </script>                                                                                                                                            
    </head>                                                                                                                                                  

    <body>                                                                                                                                                   
        <input type="radio" name="chkBox" id="chkBox" value="a" />                                                                                           
        <div id="msgid">                                                                                                                                     
        </div>                                                                                                                                               
    </body>                                                                                                                                                  
</html>

回复收藏 0 原文

浅唱々樱花落 2024-09-25 08:15:14

不仅仅是将其放入 onload 或 domready 中，您的语法和 jquery 选择器中也存在错误。请参阅下面的工作固定版本：

<!doctype html>
<html>
<head>
    <title>jQuery Hello World</title>
</head>
<body>
    <input type="radio" name="chkBox" id="chkBox" value="a" />
    <div id="msgid">
    </div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    $(function() { //on dom ready
        $('input[name=chkBox]').click(function(){ //syntax corrected
            if ($('#chkBox:checked').val() == 'a')  { //syntax corrected, selector corrected
                $('#msgid').html("This is Hello World by JQuery");
            }
        });
    });
</script>
</body>
</html>

not just putting it in an onload or domready, there's errors in your syntax and jquery selectors too. see the working fixed version below:

<!doctype html>
<html>
<head>
    <title>jQuery Hello World</title>
</head>
<body>
    <input type="radio" name="chkBox" id="chkBox" value="a" />
    <div id="msgid">
    </div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    $(function() { //on dom ready
        $('input[name=chkBox]').click(function(){ //syntax corrected
            if ($('#chkBox:checked').val() == 'a')  { //syntax corrected, selector corrected
                $('#msgid').html("This is Hello World by JQuery");
            }
        });
    });
</script>
</body>
</html>

回复收藏 0 原文

~没有更多了~