通过函数触发 jquery datepicker答案

【问题标题】：trigger jquery datepicker via a function通过函数触发 jquery datepicker
【发布时间】：2011-05-24 16:12:51
【问题描述】：

我有一长串带有日期字段的项目。允许 jQuery 将 datepicker 分配给具有 datepicker 类的所有项目正在创建一个弹出脚本（脚本的效果是运行了很长时间，你想停止脚本，是或否）更不用说渲染文档需要一段时间。当我们删除 datepicker 类时，页面几乎立即呈现。所以，我想要做的是输入字段，其中通常会使用触发器（链接或图形）填充日期，单击该触发器可以触发 datepicker 弹出日历。这样，我们只需要在实际需要的字段上提供弹出日历即可。

ID 不可用，只有 name 属性可用。

    <tr>
    <td><input type='text' name='StartDate' /> <span onclick='ShowCalendar()'>Calendar</span></td>
    <td>other fields</td>
    <td>more fields</td>
    </tr>

【问题讨论】：

这个链接的“LOOK”和功能是我想到的，但它的实现方式不会起作用，因为列表太长了。 jqueryui.com/demos/datepicker/icon-trigger.html
对这个问题还有其他想法吗？我的话题有点停滞了……

标签： jquery jquery-ui-datepicker

【解决方案1】：

我尝试了以下方法：

<script type="text/javascript">
    function createDatepicker(input) {
        $(input).datepicker().datepicker("show");
    }
</script>

<input type="text" name="someText" /><br />
<input type="text" name="someDate" onclick="createDatepicker(this)" /><br />
<input type="text" name="someText" /><br />
<input type="text" name="someDate" onclick="createDatepicker(this)" /><br />

使用这个答案，我构建了上述解决方案： How to run date picker on the first onclick event?

【讨论】：

您的“循环”不在表格标签中，而且 IE 渲染表格的速度非常慢。几百可能没问题，但我们正在谈论接近 10k 行。
您可以尝试其他选择器类型：$( "[name$=Date]" ).datepicker();
有人告诉我我们不能使用选择器，我们必须使用函数。 :(
这个版本怎么样，它可能就是你要找的。span>
@ondej-xicht-svtlik 感谢您的链接，它并不完美但足够接近！

【解决方案2】：

您可以使用“this”关键字将当前元素传递给 ShowCalendar 函数。然后，您可以将其用作参考，通过使用 jQuery 函数遍历 dom 来查找相应的日期字段。在您的示例中，您可以使用 prev() 函数。

<tr>
<td><input type='text' name='StartDate' /> <span  onclick='ShowCalendar(this)'>Calendar</span></td>
<td>other fields</td>
<td>more fields</td>
</tr>

【讨论】：

函数看起来如何？这是我到目前为止所拥有的，但它不起作用。不工作，我的意思是日历没有出现。 function ShowCalendar(el,nm,ordr){ alert(el + ' ' + nm + ' ' + ordr); // this,'proposedlivedate',#ordr#) $( "#" + nm ).datepicker(); }
试试这个函数 ShowCalendar(el,nm,ordr) { var datefield = $(el).prev(); datefield.datepicker(); }

【解决方案3】：

您需要在页面中加载日期选择器文件。然后使用这样的东西在下面的代码中，“todo_date”是一个文本字段 id，用于触发 jquery datepicker。

$( "#todo_date" ).datepicker();
function myFunc(){
  $("#calendar_img").click(function(e) { 
     $("#todo_date").datepicker("show");
  });
}

希望对你有帮助

【讨论】：