Question

当我点击<a href>标记时，它会转到新页面。然后我可以看到屏幕上显示的2按钮但是当我尝试点击按钮上的任何按钮时，它们就不会执行。

但是，如果我尝试刷新该新页面然后单击按钮，它将执行不确定出现了什么问题？我也尝试了onLoad，但它不起作用。令人惊讶的是，它会重新加载index.html页面而不是新页面

1）的index.html

 <a href="Settings.html" class="ui-btn ui-corner-all ui-shadow ui-icon-user ui-btn-icon-left">Settings</a>

2）checkLogin.js

function deleteAccount(){
var r=confirm("You are about to delete your account ?");
if (r==true)
  {
     localStorage.removeItem("testusername");
     localStorage.removeItem("testemail");
     alert("Account Deleted");
     var status = "Please Note Your Not Logged In as a Member Thus you are an annoynomous user";
     document.getElementById("loginstatus").innerHTML = status ;
 document.getElementById("buttonstatus").innerHTML = " <button id=\"myButton\" class=\"ui-btn ui-corner-all ui-shadowb\"  onclick=\"return createAccount();\">Create Account </button>" ;

  }
  else
  {
    x="You pressed Cancel!";
  }  
  }
  function createAccount(){
     window.location.assign("register.html")
  }

3）

<!DOCTYPE HTML>
<html>
   <head>

      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" type="text/css" href="js/jquery.mobile-1.4.2.css">
      <script src="js/jquery-1.11.0.min.js"></script>  
      <script src="js/jquery.mobile-1.4.2.js"></script>
      <script src="js/checkLogin.js"></script>
      <style type="text/css">
         .bgimg {
         background-image: url("js/bg2.jpg");
         }
      </style>

</head>

   <body >

      <div data-role="page" id="pageone" class="bgimg">
         <div data-role="header"  data-position="fixed" data-theme="b">
            <a href="#pageone" class="ui-btn ui-corner-all ui-shadow ui-icon-home ui-btn-icon-left" >Home</a>
            <h1><font color="#9933FF">Abby Bus T-Guide</font></h1>
            <a href="Settings.html" class="ui-btn ui-corner-all ui-shadow ui-icon-user ui-btn-icon-left">Settings</a>
         </div>
         <div data-role="main" class="ui-content" >

            <div data-role="collapsible" data-collapsed="true" >
               <h3 align="center"><B>User Profile! </B></h3>
               <div id="loginstatus"> </div>
               <!-- <div id="buttonstatus"> </div> -->
               <button id="myButton" class="ui-btn ui-corner-all ui-shadowb"  onclick="createAccount();">Create Account </button>"
               <button id="myButton" class="ui-btn ui-corner-all ui-shadowb"  onclick="deleteAccount();">Delete Account </button>

      <script>
                if(typeof(Storage)!=="undefined")
                          {

                   var user = localStorage.getItem("testusername");
                  var email = localStorage.getItem("testemail");

                  if(!user){

                   var status = "Please Note Your Not Logged In as a Member Thus you are an annoynomous user";
                   alert(status);
                   document.getElementById("loginstatus").innerHTML = status ;
                //   document.getElementById("buttonstatus").innerHTML = " <button id=\"myButton\" class=\"ui-btn ui-corner-all ui-shadowb\"  onclick=\"return createAccount();\">Create Account </button>" ;
                             }

                     else if(user){

                   var status2= "Username: "+ user +"</br>"+"Email: "+email;
                   document.getElementById("loginstatus").innerHTML = status2 ;
                 //  document.getElementById("buttonstatus").innerHTML = " <button id=\"myButton\" class=\"ui-btn ui-corner-all ui-shadowb\"  onclick=\"return deleteAccount();\">Delete Account </button>" ;


                          } 

                  }                                  
    </script> 

            </div>
         </div>
      </div>
   </body>
</html>

Answer 1

您正在尝试点击动态创建的按钮。您是否尝试使用Jquery.on（）函数绑定按钮？

https://api.jquery.com/on/

html按钮不调用javascript方法？

1 个答案: