javascript - 将日期选择器日期拆分为单独的输入

Question

我正在尝试将日期选择器日期拆分为预订引擎的 3 个输入。我想将日期传递为 CID(入住日)CIM(入住月份)和 CIY(入住年份)。我似乎已经取消了拆分流程，但正确的日期没有传递到预订引擎。请帮忙!请参阅下面的所有内容。此代码将进入 WordPress 的 PHP/文本小部件。

<小时/>

jQuery(document).ready(function() {
    jQuery('#datepicker1').datepicker({
        dateFormat : "mm-dd-yy",
        onClose: function(dateText) {
            var dateParts = dateText.split("-");

      $('#CIM').val(dateParts[0]);
      $('#CID').val(dateParts[1]);
      $('#CIY').val(dateParts[2]);
    },

 });
    });

jQuery(document).ready(function() {
    jQuery('#datepicker2').datepicker({
        dateFormat : "mm-dd-yy",
        onClose: function(dateText) {
            var dateParts = dateText.split("-");

      $('#COM').val(dateParts[0]);
      $('#COD').val(dateParts[1]);
      $('#COY').val(dateParts[2]);
    },

 });
    });

<div id="reswrap"><div id="reservations">

  <h2 style="font-size:20px; padding: 9px;">Check Availability</h2><form action="https://www.40berkeley.net/iqreservations/default.asp" method="get" name="Res_Form" onsubmit="_gaq.push(['_linkByPost', this]);">

 <table width="100%"><tbody><tr><td style="padding: 3px 1px 3px 9px;" width="35%"><label class="arrive">Arrive </label></td>

<td style="padding: 3px 1px"><input type="text" id="datepicker1" value="" name="" /></td>
<input type="hidden" name="CIM"  value="" />
    <input type="hidden" name="CID" value="" />
        <input type="hidden" name="CIY" value="" />
</tr><tr>

<td style="padding: 3px 1px 3px 9px;" width="35%"><label class="depart">Depart </label></td>

<td style="padding: 3px 1px"><input type="text" id="datepicker2" name="" value=""/></td>


    <input type="hidden" name="COM" value="" />
    <input type="hidden" name="COD" value="" />
        <input type="hidden" name="COY" value="" /> 

</tr><tr>
<td style="padding: 3px 1px 3px 9px;" width="35%"><label class="adults">Adults </label></td>
    <td style="padding: 3px 1px"><select name="AD">
    <option value="1">1</option>
    <option value="2" selected="selected">2</option>
    <option value="3">03</option>
    <option value="4">04</option>
    <option value="5">05</option>
    <option value="6">06</option>
    <option value="7">07</option>
    <option value="8">08</option>
    <option value="9">09</option>
    <option value="10">10</option>                          
    </select>
    <label>  Kids </label>
    <select name="CH">
    <option value="0" selected="selected">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">03</option>
    <option value="4">04</option>
    <option value="5">05</option>
    <option value="6">06</option>
    <option value="7">07</option>
    <option value="8">08</option>
    <option value="9">09</option>
    <option value="10">10</option>
    </select>   <select name="RSE" size="1">
<option value="0"selected="selected">Standard Rate</option>
</select>
<input name="RS" value="1" type="hidden">  </td>
</tr><tr>
    <td colspan="2" style="padding: 3px 9px;">
    <label class="promo">Promo</label><input size="10" name="PromoCode" maxlength="10" value="" type="text" /> </td>
</tr></td><td colspan="2" style="padding: 9px 9px 12px 9px; text-align:center;">
 <input type="submit" name="action" value="CHECK AVAILABILITY" class="rbtn" /></td></tr></tbody></table>





 </form>
  </div>
</div>

Answer 1

您的选择器通过 id(使用 #)搜索元素，但在您的标记中您没有定义它；您可以在以下位置更改 HTML 标记:

<input type="hidden" id="CIM" value="" />
<input type="hidden" id="CID" value="" />
<input type="hidden" id="CIY" value="" />

和

<input type="hidden" id="COM" value="" />
<input type="hidden" id="COD" value="" />
<input type="hidden" id="COY" value="" />

或者如果您想使用名称属性，请使用如下选择器:

$("input[value='CIM']").val(dateParts[0]);

等等。

引用号:http://api.jquery.com/attribute-equals-selector/

演示:http://jsfiddle.net/Lw2L3/