jquery無法綁定函數

我想將onBlur和onFocus處理程序附加到SSN輸入字段。但是，我看到一個錯誤，指出對象沒有方法「ON」。代碼是http://jsfiddle.net/H4Q5f/jquery無法綁定函數

正如你所看到的，我評論瞭解詳細信息，但迄今爲止沒有運氣。任何幫助表示讚賞。爲方便起見，這裏是代碼：

HTML：

<!doctype html> 
<html lang="en"> 

<head> 
<meta charset="utf-8" /> 
<title>Test Page</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta name="apple-mobile-web-app-capable" content="yes"> 
<meta name="apple-mobile-web-app-status-bar-style" content="black" /> 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 
<script type="text/javascript" src="../../appjavascript/ssa/mkwr/mytest.js"></script> 

</head> 

<body> 
    <div data-role="page" id="MyTestPage"> 
     <div data-role="header" data-position="fixed" data-logo="true" data-tap-toggle="false" data-fullscreen="false" > 
      <h1> Page Title </h1> 
     </div> 

     <div data-role="content"> 
      <div class="content-primary divcontent"> 
       <h1 class='h1title'>Using This App</h1> 
       <p> Here are the instructions </a> 
       </p> 
      </div> 

       <div class="inputdata"> 
        <br /> <br /> 
        <input type="text" name="accessCode" id="AccessCode" value="" placeholder="Access Code:" /> <br /> 
        <input type="text" id="ssn1" class="ssn" value="" placeholder="SSN1:" /> <br /> 
        <input type="text" id="ssn2" class="ssn" value="" placeholder="SSN2:" /> <br /> 
       </div> 
       <input type="button" id="myalert" value="Next" /> 
     </div> 
     <!-- /content --> 
</body> 
</html>

這裏是Java腳本

if (typeof TEST == "undefined" || !TEST) { 
    var TEST = {}; 
} 

(function() { 
    TEST.mkwr = { 
     init : function() { // this is a public function 
     $("[data-role='page']").on("pagebeforeshow", TEST.mkwr.hideError()); 
     $("[data-role='page']").on("pageshow", TEST.mkwr.setHandlers()); 
     }, 

     // On Blur, we need to add the '-'s if they doesn't exist so the user 
     // view edit the entered value formatted 
     ssnOnBlurHandler : function(input) { // Auto format SSN on blur 
      if ($(input).val().length == 9) { 
       var _ssn = $(input).val(); 
       var _ssnSegmentA = _ssn.substring(0, 3); 
       var _ssnSegmentB = _ssn.substring(3, 5); 
       var _ssnSegmentC = _ssn.substring(5, 9); 
       $(input).val(
         _ssnSegmentA + "-" + _ssnSegmentB + "-" + _ssnSegmentC); 
      } 
     }, // _ssnOnBlurHandler 

     // On focus, we need to remove the '-'s if they exist so the user 
     // can edit the entered value 
     ssnOnFocusHandler : function(input) { 
      // allow backspace, tab, delete, arrows, numbers and keypad numbers ONLY 
      if ($(input).val().length == 11) { 
       var _ssn = $(input).val(); 
       var _ssnSegmentA = _ssn.substring(0, 3); 
       var _ssnSegmentB = _ssn.substring(4, 6); 
       var _ssnSegmentC = _ssn.substring(7, 11); 

       $(input).val(_ssnSegmentA + _ssnSegmentB + _ssnSegmentC); 
      } 
     }, // _ssnOnFocusHandler 

     // Hide all errors 
     hideError : function() { 
      $(".error").hide(); // Hide all errors 
     }, 

     setHandlers : function() { 
      alert("Set Handlers"); 
      // $(".ssn").each(function() { 
     // var input = this; input.blur(TEST.mkwr.ssnOnBlurHandler(input)) 
     // }); 
     // $(".ssn").each(function() { 
     // var input = this; input.focus(TEST.mkwr.ssnOnFocusHandler(input)) 
     // }); 
    } 
    }; 
})(); // end the anonymous function 

$("[data-role='page']").bind("pageinit", TEST.mkwr.init());

來源

2012-06-21 Kiran

我發現了jsfiddle上的一些代碼問題。這是一個更新的工具，用於處理和解析代碼。它看起來像你的ssn邏輯可能需要修正一點，但一切都讓你到那裏。

http://jsfiddle.net/H4Q5f/10/

我看到的問題是部分給出了jQuery版本，您正在使用。對代替.bind之前發生了什麼提到。但你也沒有設置你的處理程序，而是解僱你的處理程序。你有這個：

input.bind("blur",TEST.mkwr.ssnOnBlurHandler(input))

這將返回函數的結果到set方法，這不是你正在尋找。所以我改成了這樣：

input.bind("blur",TEST.mkwr.ssnOnBlurHandler)

那麼你現在正在過處理程序設定的方法，以便在事件發生的時候，就會觸發。

希望這是有道理的。

來源

2012-06-21 16:29:53 spinon

感謝spinon，不幸的是，我無法弄到小提琴上班。我的意思是當我爲類ssn的第二個輸入元素輸入'123123123'時，我沒有看到它是自動生成的。我錯過了什麼？ – Kiran

好的，我更新了jsfiddle（http://jsfiddle.net/H4Q5f/11/）。我只是從讓處理者開火的角度來看待它。所以我真的沒有看到爲什麼代碼不工作。 – spinon

謝謝，這是完美的，現在我意識到了代碼的問題.. – Kiran

的.on()函數，jQuery的1.7推出。你上面發佈的代碼包括jQuery 1.6.4（<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>），它沒有這個功能。您可以升級到最新版本的jQuery（推薦），也可以使用舊版本的等效功能 - .bind()。

來源

2012-06-21 15:57:16

謝謝。我實際上在使用之前試用過。但問題是它不是調用setHandlers函數。 – Kiran

@Kiran舊版本的等價函數是'.bind（）'（代碼中'.on（）'的特殊用法，還有其他一些使用'.on（）'的方法可以匹配其他舊函數），所以我會嘗試先使用它。還要確保代碼在DOM加載後運行，要麼在關閉「」標記之前包含相關的Javascript，要麼使用DOM就緒事件。 –

謝謝@Anthony，我更新了綁定（http://jsfiddle.net/H4Q5f/）。但是，我回到了所有這個實驗開始的同樣的問題。代碼 $（「.ssn」）。each（function（）{var input = this; input.blur（TEST.mkwr.ssnOnBlurHandler（input）） }）; 在上面的jsfiddle沒有附加。難道我做錯了什麼？ – Kiran

jquery無法綁定函數

回答

相關問題