2012-08-01 48 views
8

,我發現了錯誤Uncaught TypeError: Object [object Object] has no method 'datepicker'在我的JavaScript這裏:對象有沒有方法,日期選擇器

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script> 
<script type='text/javascript'> 
$(function() { 
    $("#birthday").datepicker({changeMonth: true}); 
}); 
</script> 

這裏,我試圖將它添加到生日項目:

<!--// BIRTHDAY //--> 
<li class="field"> 
    <label for="birthday">Birthday</label> 
    <div class="field"><input type="text" id="birthday" name="birthday" value="" class="" /></div> 
</li> 

正如你可以看到,我正在包含jquery ui的源代碼,正好在我試圖使用datepicker的地方。我從http://jqueryui.com/docs/Downloading_jQuery_UI得到的URL,所以我很確定這是一個有效的URL。我也嘗試上傳文件並鏈接到本地​​副本,但我仍然遇到同樣的錯誤。我還能嘗試什麼?

編輯:

我有使用此加載jQuery庫:<script type="text/javascript" src="/includes/js/jquery-1.7.2.min.js"></script>,並與該位腳本的驗證:

if (jQuery) { 
    alert("jQuery library is loaded!"); 
} 
+0

試看看您的瀏覽器的檢查器(Chrome瀏覽器開發工具,螢火蟲等) - 有沒有404錯誤? – 2012-08-01 14:11:20

+1

只是作爲一個測試,試試:$ .noConflict()在你的文檔準備好看看它是否有衝突的jquery – 2012-08-01 14:12:25

+0

它適用於我:http://jsfiddle.net/nyhCF/ – FishBasketGordo 2012-08-01 14:13:20

回答

23

從我們的討論中,我們發現,將變量$(別名jQuery)表現不正常。通常,這是因爲另一個JS插件已將$更改爲表示其他內容。爲了解決這個問題,你可以用你的jQuery代碼是這樣的:

jQuery(function($){ 
    //all jQuery code which uses $ needs to be inside here 
}); 

這將函數的範圍內改變的$的含義。

+1

好的呼叫,男人! – user1477388 2013-01-22 15:59:12

3

您可能會遇到jQuery衝突。給它noConflict模式一試,像這樣:

<script type="text/javascript"> 
    (function($) { 
     $(document).ready(function(){ 
      $("#datepicker").datepicker(); 
     }); 
    })(jQuery); 
</script> 
+1

如果答案完全一致,最好在評論的其他帖子中鏈接到你的答案。 – Arun 2013-03-02 08:51:12

0
<script type="text/javascript"> 
(function($){ 
     var pickerOpts = { 
      // minDate: new Date(), 
      //maxDate: "+3m,", 
      showButtonPanel: true, 
      showOn: "button", 
      buttonImage: "images/cal.png", 
      }; 
    $("#birthday").datepicker(pickerOpts); 
     })(jQuery); 
</script> 

link source solution

1

$會像

$(function($) { 
    $("#dateTasted").datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: "yy-mm-dd"  
    }); 
}); 
相關問題