Как показать jQuery DatePicker при нажатии кнопки?

Привет, я увидел учебник о создании datepicker с использованием изображения. Ive скопировать и вставить точные коды (для пути изображения, за исключением), но календарь изображение не показывает, может кто-нибудь помочь мне, пожалуйста ...: DКак показать jQuery DatePicker при нажатии кнопки?

здесь код

<HTML> 
<HEAD> 

<style type="text/css"> 
body 
{ 
    font-size: 10pt; 
} 

</style> 


<script type="text/javascript"> 

$(document).ready(function() { 

    $("#txtDate").datepicker({ 
     showOn: 'button', 
     buttonText: 'Show Date', 
     buttonImageOnly: true, 
     buttonImage: 'calendar.jpg', 
     dateFormat: 'dd/mm/yy', 
     constrainInput: true 
    }); 

    $(".ui-datepicker-trigger").mouseover(function() { 
     $(this).css('cursor', 'pointer'); 
    }); 

}); 

</script> 


</HEAD> 
<BODY> 
<input type='text' id='txtDate' /> 

</BODY> 
</HTML>

источник

2013-07-12 user2574957

Пройти через учебник ... попробуйте написать свою собственную программу –

yup., Получил это., Im new к этому :) – user2574957

Вам нужно включить обе библиотеки JQuery и JQuery UI для этой работы

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

Ex:

<HTML> 
    <HEAD> 
     <style type="text/css"> 
      body { 
       font-size: 10pt; 
      } 
     </style> 
     <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
     <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> 
     <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>   

     <script type="text/javascript"> 

      $(document).ready(function() { 

       $("#txtDate").datepicker({ 
        showOn: 'button', 
        buttonText: 'Show Date', 
        buttonImageOnly: true, 
        buttonImage: 'calendar.jpg', 
        dateFormat: 'dd/mm/yy', 
        constrainInput: true 
       }); 

       $(".ui-datepicker-trigger").mouseover(function() { 
        $(this).css('cursor', 'pointer'); 
       }); 

      }); 

     </script> 


    </HEAD> 
    <BODY> 
     <input type='text' id='txtDate' /> 

    </BODY> 
<HTML>

Демо: Plunker

источник

2013-07-12 03:27:08

Спасибо, что сейчас работаем: D – user2574957

Понял, так вам. : D – user2574957

Добавить библиотеку JQuery и пользовательский интерфейс, как это:

<script type="text/javascript" src="/scripts/jquery-1.10.2.min.js"></script> 
<script type="text/javascript" src="/scripts/jquery-ui-1.10.3.custom.min.js"></script>

источник

2013-07-12 03:24:50 Alex

Вы должны включить JQuery UI путь

полный рабочий код здесь

<HTML> 
<HEAD> 

<style type="text/css"> 
body 
{ 
    font-size: 10pt; 
} 

</style> 

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.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"> 

$(document).ready(function() { 

    $("#txtDate").datepicker({ 
     showOn: 'button', 
     buttonText: 'Show Date', 
     buttonImageOnly: true, 
     buttonImage: 'calendar.jpg', 
     dateFormat: 'dd/mm/yy', 
     constrainInput: true 
    }); 

    $(".ui-datepicker-trigger").mouseover(function() { 
     $(this).css('cursor', 'pointer'); 
    }); 

}); 

</script> 
<head> 
<body> 

<input type="text" id="txtDate" /> 

</body>

источник

2013-07-12 03:42:45 ramesh

Как показать jQuery DatePicker при нажатии кнопки?

ответ

Смежные вопросы