jQuery datepicker仅适用于第一个.datepicker元素

时间:2016-12-08 23:30:18

标签: jquery angularjs jquery-ui datepicker

我试图让jQuery datepicker在页面上的多个元素上工作。我使用的是jQuery 1.11.3和jQuery-UI 1.12.1

我给每个元素一个.mydatepicker类:​​



$(function() {
    $(".mydatepicker").datepicker();
});

<!-- jQuery + jQuery ui & Bootstrap -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<!-- AngularJS 1.5.8 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.2/angular-ui-router.min.js"></script>

<!-- Firebase not working in snippet -->
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/js-data-firebase/2.1.1/js-data-firebase.min.js"></script>-->

<!-- AngularFire -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angularFire/2.1.0/angularfire.min.js"></script>

<!-- Bootstrap UI -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.3.0/ui-bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.3.0/ui-bootstrap-tpls.min.js"></script>

<form>
    <div class="form-group row">
        <div class="col-xs-12">
            <input class="form-control mydatepicker" aria-label="Date" placeholder="01/01/2000" type="text" ng-model="blah.due">
        </div>
    </div>
</form>

<table>
    <tr>
        <td>
            <input date-directive class="form-control mydatepicker" aria-label="Date" type="text" ng-model="blah.due" ng-change="blahs.$save(blah)">							
        </td>
    </tr>
</table>
&#13;
&#13;
&#13;

它仅适用于1 ...

0 个答案:

没有答案