2017-07-17 86 views
-1

我正在試驗Jquery Mobile,我似乎無法看到我的錯誤,爲什麼我的表單元素返回'undefined'。我相信我的錯誤可能是我的表單在我的成員按鈕上運行onclick()函數時尚未創建。我知道這段代碼可能不會運行,因爲我的HTML中缺少css/js文件。我希望有人能很快看到我的錯誤並指出它。爲什麼.val()使用jquery mobile爲DOM元素返回'undefined'?

JS:

$(document).ready(function() { 


}); 

function createMember() { 
    var memberName = $("#memberName").val(); 
    var userName = $('#username').val(); 
    var pass = $('#password').val(); 

    var newMember = new submitMember(memberName, userName, pass); 
    console.log(newMember); 
} 

function submitMember(Name, Username, Password) { 
    this.Name = Name; 
    this.UserName = Username; 
    this.Password = Password; 
} 

HTML:

<!DOCTYPE html> 
<html> 
    <head> 
     <link rel="stylesheet" href="C:\Users\ali\Desktop\Jquery Mobile\themes\CustomDarkBlue.css" /> 
     <link rel="stylesheet" href="C:\Users\ali\Desktop\Jquery Mobile\themes\jquery.mobile.icons.min.css"/> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile.structure-1.4.5.min.css"/> 
     <script src="C:\Users\ali\Documents\jquery-2.0.0.min.js"></script> 
     <script src="C:\Users\ali\Desktop\Jquery Mobile\jquery.mobile.custom.js"></script> 
     <script src="C:\Users\ali\Documents\Youtube_ContactsApp\js\VolunteerEfforts.js"></script> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"><!--the meta tag is to ensure that the view size remains 1px to 1 display pixel--> 
    <!--class="ui-btn-active"--> 
    </head> 
     <title>Volunteer Effort</title> 
      <body> 
       <div data-role="navbar" data-grid="c"> 
        <ul> 
         <li><a href="#popupLoginInstitute" data-rel="popup" data-position-to="window" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-check ui-btn-icon-left ui-btn-a" data-transition="pop">Institution</a></li> 
         <li><a href="#popupLoginMember" data-rel="popup" data-position-to="window" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-check ui-btn-icon-left ui-btn-a" data-transition="pop">Member</a></li> 
         <li><a href="#" class="ui-btn-active">Upcoming Events</a></li> 
         <li><a href="#" class="ui-btn-active">Contact</a></li> 
        </ul> 

         <!--<button type="submit" id="submit" onclick = "createMember()" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-btn-icon-left ui-icon-check">Sign Up</button>--> 

       </div><!--/navbar--> 

       <div data-role="popup" id="popupLoginInstitute" data-theme="a" class="ui-corner-all"> 
        <form> 
         <div style="padding:10px 20px;"> 
          <h3>Sign up as a new Institution</h3> 
          <label for="institution" class="ui-hidden-accessible">Username:</label> 
          <input type="text" name="user" id="institution" value="" placeholder="Institution Name" data-theme="a"> 
          <label for="Address" class="ui-hidden-accessible">Institution Address:</label> 
          <input type="text" name="address" id="address" value="" placeholder="Address" data-theme="a"> 
          <label for="username" class="ui-hidden-accessible">Username:</label> 
          <input type="text" name="user" id="username" value="" placeholder="Username" data-theme="a"> 
          <label for="password" class="ui-hidden-accessible">Password:</label> 
          <input type="password" name="pass" id="password" value="" placeholder="Password" data-theme="a"> 
          <label for="email" class="ui-hidden-accessible">Email:</label> 
          <input type="text" name="email" id="email" value="" placeholder="Email" data-theme="a"> 
          <label for="institutionSelect">Institution Selection:</label> 
          <select name="institutionSelect" id="institutionSelect" data-mini="true"> 
           <option value="1">Religious Organization</option> 
           <option value="2">Food Bank</option> 
           <option value="3">Homeless Shelter</option> 
           <option value="4">Public School</option> 
          </select> 
          <button type="submit" id="submitInstitute" onclick = "createInstitute()" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-btn-icon-left ui-icon-check">Sign Up</button> 
         </div> 
        </form> 
       </div> 

       <div data-role="popup" id="popupLoginMember" data-theme="a" class="ui-corner-all"> 
        <form> 
         <div style="padding:10px 20px;"> 
          <h3>Sign up as a new Member</h3> 
          <label for="member" >Full Name:</label> 
          <input type="text" name="member" id="memberName" placeholder="Member's Full Name" data-theme="a"> 
          <label for="username" class="ui-hidden-accessible">Username:</label> 
          <input type="text" name="user" id="username" placeholder="Username" data-theme="a"> 
          <label for="password" class="ui-hidden-accessible">Password:</label> 
          <input type="password" name="pass" id="password" placeholder="Password" data-theme="a"> 
          <button type="button" onclick="createMember()" id="submitMember" >Sign Up</button> 
         </div> 
        </form> 
       </div> 
      </body> 
</html> 
+0

在你的 「準備」 處理那些'var'聲明沒有任何意義。它們對處理函數以外的任何內容幾乎沒有任何影響。 – Pointy

+0

我的不好,我在jsfiddle測試並忘記刪除。我havfe做出了正確的編輯 –

+0

你是否來自另一種編程語言而不是Javascript?我正在使用手機,但我認爲您的提交會員功能是錯誤的,尤其是關於此關鍵字。可能是錯誤的。祝你好運。 –

回答

2

你的功能應該設置this.propertyName,不設置變量。

function submitMember(name, userName, password) { 
 
    this.name = name 
 
    this.userName = userName; 
 
    this.password = password 
 
} 
 

 
var user1 = new submitMember("A", "B", "C"); 
 
var user2 = new submitMember("FOO", "BAR", "WORLD"); 
 
console.log(user1); 
 
console.log(user2);

+0

僅供參考,是否需要撥打新電話?不太清楚這是如何工作的,或者甚至是需要的。 –

相關問題