Как показать средство выбора даты только при нажатии значка с помощью Jquery?

Я столкнулся с одной проблемой. Мне нужно отображать средство выбора даты jquery только при щелчке значка. Я объясняю свой код ниже.

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7"></i>
</span>
$(function(){
  $("#car_d_date").datepicker();
  $("#calicon").click(function(){
    $("#car_d_date").datepicker('show');
  })
})

В моем случае также щелкните поле ввода, чтобы отобразить календарь. Здесь мне нужно, когда пользователь нажмет на значок календаря, тогда календарь будет отображаться, а выбранная дата будет отображаться в текстовом поле.


person Community    schedule 24.11.2018    source источник
comment
скрыть средство выбора даты после инициализации. $("#car_d_date").datepicker('hide');   -  person DPS    schedule 24.11.2018
comment
$(#car_d_date).datepicker(show); Попробуй это.   -  person Dixit Akabari    schedule 24.11.2018


Ответы (1)


Вы можете установить пустое значение атрибута showOn средства выбора даты.

$("#car_d_date").datepicker({
  showOn: ''
});
$("#calicon").click(function(){
  $("#car_d_date").datepicker('show');
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7">icon</i>
</span>

person Mohammad    schedule 24.11.2018
comment
Брат, лучше, если она закроется при повторном щелчке. - person WC2; 24.11.2018
comment
@ WC2 Это можно сделать с помощью простого кода, но средство выбора даты не делает этого по умолчанию. Когда вы нажимаете на ввод даты, отображается только отображение, а при повторном нажатии оно также отображается и не закрывается - person Mohammad; 24.11.2018
comment
для переключения эффекта на значок нажмите var i = 0; $("#calicon").click(function(){ console.log(i); if(i == 0){ $("#car_d_date").datepicker('show'); i++; } else { $("#car_d_date").datepicker('hide'); i--; } }); - person Pranesh Janarthanan; 24.11.2018