Question

我正在尝试打开datepicker对话框。为此，我在html输入控件中编写inlinde代码。代码看起来像这样

<form:input path="sanctionLoans[${count.index}].sanctionDate"
                                    readonly="${param.readOnly}" 
                                    style="text-align: right; width: 100px;"
                                    onclick="findMinDate()"
                                    onclick="$(this).datepicker({ dateFormat: 'dd-mm-yy' ,changeMonth: true,changeYear: true }).datepicker('show');"/>

此代码工作正常并打开对话框。但是现在我想把这段代码写成函数，这样我就可以像onselect一样处理其他事件，像这样关闭。为此我写了一个像这样的函数。

function findMinDate(event){
    var id = $(event).attr('id');
    console.log(id);
    id = id.replace(/\./g, "\\\\.");
    var ele = '#' + id;
    console.log(ele);
    $("#sanctionLoans1\\.sanctionDate").datepicker({
        dateFormat: 'dd-mm-yy' ,    
        changeMonth: true,
        changeYear: true
        onSelect: function(endDate) {

          }
        })
        .datepicker('show');
}

现在这个函数出现问题，因为输入控件ID包含句点运算符（。）所以首先用＆＃39; \。＆＃39;替换它。但用\替换。（点）后。它不会打开对话框。但是，如果硬核称之为＆＃34;＆＃34;＃sanctionLoans0 \ .sanctionDate＆＃34;然后它工作正常。有人可以帮助解决功能上的错误。

Answer 1

这个

var id = $(event).attr('id');

应该是

var id = $(event.target).attr('id'); //or event.target.id

id = id.replace(/\./g, "\\.");。
changeYear: true错过,

另外，我发现你已经有onclick="$(this).datepicker({ dateFormat: 'dd-mm-yy' ,changeMonth: true,changeYear: true }).datepicker('show');"，所以你不需要调用内联函数。

<强> Fiddle Demo

Answer 2

您还需要转发[和]以及

id = id.replace(/(\.|\[|\])/g, "\\$1");

但你真的不希望你能

function findMinDate(event) {
    $(event.target).datepicker({
        dateFormat: 'dd-mm-yy',
        changeMonth: true,
        changeYear: true
        onSelect: function (endDate) {

        }
    }).datepicker('show');
}

Answer 3

你可以这样使用

$("input [id^='sanctionLoans1'][id$='sanctionDate']").datepicker({..............
..............
})

或者你可以这样做

> var id = $(event.target).attr('id');  var tempId = id.split(".");
> 
>  $("input[id^='"+tempId[0]+"'][id$='"+tempId[1]+"']").datepicker({...
> ........ })

当id具有句点运算符

3 个答案: