2016-12-07 3 views
0

jQuery UI datepicker에 문제가 있습니다. 이 코드를 가지고 :내 jQuery 스크립트가 한 번만 실행되는 이유는 무엇입니까?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script> 
 
<script> 
 
    jQuery(document).ready(function($) { 
 
    $('#datepickerFrom').datepicker({ 
 
     dateFormat: 'yy-m-d', 
 
     inline: true, 
 
     onSelect: function(dateText, inst) { 
 
     var date = $(this).datepicker('getDate'), 
 
      day = date.getDate(), 
 
      month = date.getMonth() + 1, 
 
      year = date.getFullYear(); 
 

 
     var url = $('#reservation').attr('href'); 
 
     url = url.replace('05&', day + '&'); 
 
     $('#reservation').attr('href', url); 
 

 
     var url2 = $('#reservation').attr('href'); 
 
     url2 = url2.replace('12', month); 
 
     $('#reservation').attr('href', url2); 
 

 
     var url3 = $('#reservation').attr('href'); 
 
     url3 = url3.replace('2016', year); 
 
     $('#reservation').attr('href', url3); 
 
     } 
 
    }); 
 

 
    $('#datepickerTo').datepicker({ 
 
     dateFormat: 'yy-m-d', 
 
     inline: true, 
 
     onSelect: function(dateText, inst) { 
 
     var date = $(this).datepicker('getDate'), 
 
      day = date.getDate(), 
 
      month = date.getMonth() + 1, 
 
      year = date.getFullYear(); 
 

 
     var url4 = $('#reservation').attr('href'); 
 
     url4 = url4.replace('=2016', '=' + year); 
 
     $('#reservation').attr('href', url4); 
 

 
     var url5 = $('#reservation').attr('href'); 
 
     url5 = url5.replace('13', +month); 
 
     $('#reservation').attr('href', url5); 
 

 
     var url6 = $('#reservation').attr('href'); 
 
     url6 = url6.replace('09', day); 
 
     $('#reservation').attr('href', url6); 
 

 
     } 
 
    }); 
 
    }); 
 
</script> 
 
<p>Date arrivée : 
 
    <input type="text" id="datepickerFrom"> 
 
</p> 
 
<p>Date départ : 
 
    <input type="text" id="datepickerTo"> 
 
</p> 
 

 
<a id="reservation" class="et_pb_button et_pb_button_0 et_pb_module et_pb_bg_layout_light" href="https://mywebsite.com/book?shs&chkin=2016-12-05&chkout=2016-13-09&step=1">Réservez</a>

내가 날짜 (datepickerTo 및 datepickerFrom)을 클릭하면, 내 HREF 링크를 업데이트하지만 한 번만. 날짜를 변경하면 스크립트가 실행되지 않습니다.

+0

'url = url.replace ('05 &', day + '&');', 처음으로 날짜를 변경할 때! = 5'replace' 함수는 대체 할 물건을 찾을 수 없습니다. – empiric

답변

1

처음 값만 검색하고 바꿀 때만 처음으로 작동합니다. 지정된 해에, '2016'주어진 달 '12'과

var url = $('#reservation').attr('href'); 
url = url.replace('05&', day + '&'); 
$('#reservation').attr('href', url); 
var url2 = $('#reservation').attr('href'); 
url2 = url2.replace('12', month); 
$('#reservation').attr('href', url2); 
var url3 = $('#reservation').attr('href'); 
url3 = url3.replace('2016', year); 
$('#reservation').attr('href', url3); 

그것은 기본적으로 대체 '05'어떤 주어진 일 : 당신의 코드를 확인하십시오. 사용자가 다른 날짜를 선택하면이 코드는이 새로운 날짜로 대체 할 항목을 찾지 않습니다.

+0

젠장, 바보입니다. 감사합니다. –

+0

Upvote done;) 하지만 동적으로 내 href 링크를 업데이트하는 방법을 모르겠습니다. 아이디어가 있습니까? 처음에는이 href가 "& chkin = 2016-12-05 & chkout = 2016-13-09 & step = 1"입니다 ... –

+0

나는 href를 바꾸지 않고 날짜의 새로운 요일과 월 및 일을 얻습니다. (두 필드 모두에서), href 값을 매번 다시 작성하십시오. –