Question

我正在使用由Stefan Petre创建的日期选择器jQuery插件，可在此处获取：

http://www.eyecon.ro/datepicker/#about

这是我用来将datepicker应用于文本框的代码

 $('.tableMstCellECD').DatePicker({
            format: 'd/m/Y',
            date: $('.tableMstCellECD').val(),
            current: $('.tableMstCellECD').val(),
            calendars: 3,
            onChange: function (formated, dates) {
                $('.tableMstCellECD').val(formated);
                $('.tableMstCellECD').DatePickerHide();
            }
        });

它工作正常，但显然更新了所有文本框的值而不是选定的值。问题是可能有不同数量的texbox，所以我不能硬编码访问值。我试图在这个命令的某处实现“this”关键字，但没有成功

Answer 1

我同意Deepanshu，你应该使用jQuery UI。如果你想因某些原因避免这种情况，KarelG的解决方案可以正常工作，但是因为你已经包含了jQuery，你可以这样写：

$('.tableMstCellECD').each(function(){
    var id = $(this).attr('id');
    $(this).DatePicker({
        format: 'd/m/Y',
        date: $('#' + id).val(),
        current: $('#' + id).val(),
        calendars: 1,
        onChange: function (formated, dates) {
            $('#' + id).val(formated);
            $('#' + id).DatePickerHide();
        }
    });
});

您还必须为服务器或客户端上的输入元素生成唯一的ID-s，如下所示：

<input type="text" id="01" class="tableMstCellECD" />
<input type="text" id="02" class="tableMstCellECD" />
<input type="text" id="03" class="tableMstCellECD" />
<input type="text" id="04" class="tableMstCellECD" />

Answer 2

我之前也遇到过这个问题。所以我写了一个自己的脚本（在js中）来实现它到文本框，它只包含类名“datepicker”或不同的东西。为了给大多数浏览器提供支持，我已经这样做了;

/*
* === javascript file to implement datepicker on form fields for dates
*
* @author : Karel Geiregat
* @version : 1.0.4 - 18 may 2013
*/

// class name which contains input box, chosen for dates
var comparerString = "datepicker";

// get all inputfields, select only those marked with right class name
window.addEventListener('load', function() {
    // select all input boxes
    var getElements = document.getElementsByTagName("input");
    // check count
    var count = getElements.length;
    // loop through elements
    for(var i = 0; i < count; i++) {
        // get classname - supported by most major browsers
        if (getElements[i].className == comparerString) {
            var idField = "#" + getElements[i].id;
            $(idField).datepicker({ dateFormat: "yy-mm-dd" });
        }
    }
});

和HTML

<input id="form_startDate" class="datepicker" type="text" required="required">

在jQuery中写一些类似的东西。只需在文本框中添加一个类名，该文本框应使用DatePicker对象进行标记。

datepicker的文本框访问权限

2 个答案: