Question

在使用jQuery时，我绝对是新手。我编写代码并在Dreamweaver中测试它。它完美运行，直到我尝试在浏览器中运行它。 jQuery的目标是隐藏<div>，将文本附加到另一个<div>并显示<div>。我将所有编码都放在名为scripts.js的文件中。

此文件的内容为

$(document).ready(function() { //SignIn validation + content change

    $("#enter_email").hide();
    $("#enter_password").hide();
    $("#main2").hide();

    $("#signIn").click(function(event){
        var email = $("#Email").val();
        var password = $("#password").val();
        if(email == "" && password == "" )
            $("#enter_email").show().add("#enter_password").show(); 
        else if(email != "" && password == "")
            $("#enter_password").show();
        else if(email == "" && password != "" )
            $("#enter_email").show();
        else if(email == "admin" && password == "password")
            $("#login").hide().add("#register").hide().add("#displayUserName").text(', ' + email).add("#main2").show().remove("#register");
        else
        (overlay());
    }); 

    var now = new Date();
    var hours = now.getHours();
    var msg;
    if(hours<12)
        msg = "Good Morning";
    else if(hours<18)
        msg = "Good Afternoon";
    else
        msg = "Good Evening";
    $('#greeting').text(msg);


    //Control the look of selected catalog categories

    $(".shop-links1").click(function(){//Add category to selected
        $(".clear").show();
        $("#selected").show();
        $("#catalogNav1").hide();   
        $('div[class="shop-links1"]').add("#selected ul").append("<li><a class='selectedLinks' href=''>Category: " + $(this).text() + " </a></li>");        });

    $(".shop-links2").click(function(){//Add price to selected
        $(".clear").show();
        $("#selected").show();
        $("#catalogNav2").hide();   
        $('div[class="shop-links2"]').add("#selected ul").append("<li><a class='selectedLinks' href=''>Price: " + $(this).text() + " </a></li>");
        });

    $(".shop-links3").click(function(){//Add size to selected
        $(".clear").show();
        $("#selected").show();
        $("#catalogNav3").hide();   
        $('div[class="shop-links3"]').add("#selected ul").append("<li><a class='selectedLinks' href=''>Size: " + $(this).text() + " </a></li>");
        });

    $(".shop-links4").click(function(){//Add artist to selected
        $(".clear").show();
        $("#selected").show();
        $("#catalogNav4").hide();   
        $('div[class="shop-links4"]').add("#selected ul").append("<li><a class='selectedLinks' href=''>Artist: " + $(this).text() + "</a></li>");
        });

    $(".clear").click(function(){
        $(".clear").hide();
        $("#selected ul li:not(:first)").remove();
        $("#selected").hide();
        $("#catalogNav1").show();
        $("#catalogNav2").show();
        $("#catalogNav3").show();
        $("#catalogNav4").show();   
    });

    //Sort catalog

    $("#tops").click(function(){//Sort by tops
            $(".tops").show();
            $(".tunics").hide();
            $(".dresses").hide();
        });

        $("#tunics").click(function(){//Sort by tunics
            $(".tops").hide();
            $(".tunics").show();
            $(".dresses").hide();

        });

        $("#dresses").click(function(){//Sort by dresses
            $(".tops").hide();
            $(".tunics").hide();
            $(".dresses").show();
        });

});//End document.ready

评论“//控制所选目录类别的外观”下面的区域就是我用来做这件事的。

HTML头是

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/scripts.js"></script>

<!-- Unique title on each page to increase search engine optimisation.  Should always contain accurate information as well as some of the main focus areas. --> 
<title>Art on Fashion</title> 

<!-- Page description meta tag gives search engines a summary of what the page is about -->
<meta name="description" content="This site has been created and submitted in partial fulfilment of the BSc Hons Information and Communication Technologies course, it is a final year project that focuses on XHTML, PHP, JavaScript, SEO, MySQL, CSS and a Content Management System"/>

<link href="css/styles.css" rel="stylesheet" type="text/css" media="screen" />

</head>

Answer 1

~~我不相信将href留空是有效的HTML。~~如果您使用jQuery拦截锚标记的默认click行为，{ {1}}，使用<a>。

不要忘记将jQuery's preventDefault()放在每个href="#"处理函数的顶部，这将：

阻止页面跳到顶部，
防止将哈希添加到网址
以及防止将散列网址添加到浏览历史记录中。

jQuery的：

click

HTML：

$(".shop-links2").click(function(event){
   event.preventdefault();
   // your click handler code
});

jQuery在Dreamweaver中运行良好，但在任何浏览器中都不行。怎么修？

1 个答案: