复制的文件不工作 - id不能跨不同的页面工作html javascript php?

时间:2013-09-16 22:47:18

标签: javascript php jquery html css-selectors

我有一项非常简单的任务,但是我不知道为什么。我有一个PHP文件(主要是HTML),我只是复制到同一文件夹中的另一个文件,期望具有相同的功能。我有两个按钮,按下时会弹出一个窗口,但是在新页面中,每当按下一个按钮时,我都会在URL中获得页面的pageURL + #id,没有任何反应。例如:      “{/project/login.php#loginmode}”“是的,它在localhost上

我理解它的方式,id在页面中必须是唯一的,但它们在文件夹中的页面中是否也是唯一的?我尝试更改id名称,只是为了找到URL中显示的新ID名称。我也尝试将原始文件复制到一个完全不同的目录,但仍然存在同样的问题。然后我尝试在那里更改ID名称,但仍然没有去。我错过了什么?我重新启动了我的服务器并多次清除了缓存...

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf=8"/>
    <title>TITLE/title>
    <link rel="stylesheet" type="text/css" href="style.css" me2dia="screen" />
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="icon" href="/favicon.ico" type="image/x-icon">       
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <link href='http://fonts.googleapis.com/css?family=Terminal+Dosis' rel='stylesheet' type='text/css' />

    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery.leanModal.min.js"></script>

    <div id = "top">
        <center>
            <nav>
                <a class="navbtn" href="about.php" style="padding: 0px 10px 0px 10px">  ABOUT</a> |
                <a href="#loginmode" class="navbtn modaltrigger" style="padding: 0px 10px 0px 10px">  LOGIN  </a> |
                <a href="#contactmodal" class="navbtn modaltrigger" style="padding: 0px 10px 0px 10px"> CONTACT</a> 
            </nav>
        </center>
        </br></br></br>
    </div> 

    <!--script for checking logging and creating user--> 
    <script type = "text/javascript">  
        function checkLogin(){ 
            var u = document.getElementById("username").value;
            var p = document.getElementById("password").value;

            var xmlhttp;
            if (window.XMLHttpRequest) //using AJAX
              {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest();  
              }
            else
              {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }

            //using AJAX:        
            xmlhttp.onreadystatechange = function(){
                if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
                    if(xmlhttp.responseText == u){
                        alert('You have entered a correct username and/or password.');
                        window.location = 'home.php'; //should change from home to newposting.php???
                    }
                    else{
                        alert('You have entered an incorrect username/password combination.  Please try again.');
                        //href=\"javascript:history.go(-2)\"
                        //window.location = 'loginredo.php';                    
                    }
                }
            }
            xmlhttp.open("GET", "checkpw.php?u=" + u + "&p=" + p, true);
            xmlhttp.send(); 
        }

        function newUser(){
            location.href = 'signup.php';

        }
    </script>
</head>

<body>  
    <center>
    <!--Login-->
        <div id="loginmode" style="display:none;">
          <logh1>Sign In:</logh1>
          <form id="loginforme" name="loginforme" method="post" action="index.html">
            <label for="username"><h2>Username:</h2></label>
            <input type="text" name="username" id="username" class="txtfield" tabindex="1">

            <label for="password"><h2>Password:</h2></label>
            <input type="password" name="password" id="password" class="txtfield" tabindex="2">

            <div class="center">
                <input type="submit" name="loginbtn" id="loginbtn" class="flatbtn-blu hidemodal" value="Log In" onclick="checkLogin(); return false;" tabindex="3">
                <input type="submit" name="newusrbtn" id="create-user"" class="flatbtn-blu hidemodal" value="New User" onclick="newUser();" tabindex="4">
            </div>

          </form>
        </div>

    <!--Contact-->
        <div id="contactmodal" style="display:none;">

          <logh1>Contact GULSEN:</logh1>
          <form name="contactform" action="contact.php" method="post"> <!--cannot have id="contactform"-->
            <label for="cf_first_name"><h2>First Name</h2></label>
            <input type="text" name="cf_first_name" class="txtfield" tabindex="1">

            <label for="cf_last_name"><h2>Last Name</h2></label>
            <input type="text" name="cf_last_name" class="txtfield" tabindex="2">

            <label for="cf_email"><h2>Email Address</h2></label>
            <input type="text" name="cf_email" id="cf_email" class="txtfield" tabindex="3">

            <label for="password"><h2>Message</h2></label>
            <textarea name="cf_message" cols="100" rows="5" class="txtfield" tabindex="4" style="resize: none; outline: none"></textarea>      

            <label for="cf_reference"><h2>How did you hear about GULSEN?</h2></label>
            <input type="text" name="cf_reference" id="cf_reference" class="txtfield" tabindex="5">   

            <div class="center">  
              <input type="submit" class="flatbtn-blu" value="Send">
              <input type="reset" class="flatbtn-blu" value="Clear">
            </div>
          </form>
        </div>
    </center>  

    <script type="text/javascript">
        $(function(){
          $('#loginforme').submit(function(e){
            return false;
          });

        $('#contactform').submit(function(e){
            return false;
          });

          $('.modaltrigger').leanModal({ top: 110, overlay: 0.45, closeButton: ".hidemodal" });

        });
    </script>  

<div id="footer"></div>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

请尝试以下代码

$(".modaltrigger").click(function(){
  var href= $(this).attr('href');
  $(href).show();
});

修改 但我怀疑JS文件没有正确加载。使用Inspect Element工具查看您是否在浏览器控制台上出现任何错误。