如何在输入区域中添加onclick jquery函数

Question

我是Javascript和jquery的新手我有一个jquery函数

$('.input-group .date').datepicker({
    });

对于

<div class="input-group date" id="dp3">
<input class="form-control" type="text"  placeholder="Date" name="date" value="">
</div>

我想在onclick=""添加这个内部输入标签，你能告诉我怎么做吗？

Answer 1

如果我在想你的想法，那就错了。

.datepicker()已经分配了一个onClick事件，因此您不必创建额外的事件。 您必须确保使用jQuery和jQuery UI才能使datepicker工作。

然后，您必须在关闭body或头部之前放置脚本并使用

$(document).ready(function(){ ... });

我也认为你在这里使用了错误的选择器。

. 是上课
#是ID

所以它应该是

$('.input-group .form-control').datepicker();

Answer 2

对于那些来到这个问题的人，因为他们想知道如何绑定到有人点击输入框时发生的事件，那么这很有用：

$('input.your-input-box-class').focus(function(e){
    // do something
});

对于那些想要像原始问题一样使用datepicker的人，请记住jQuery UI从这些类型的细节中抽象出来。 所以只需使用它们本来要使用的小部件。 在这种情况下，当DOM完成加载时，为所有具有特定类（比如说date ）的输入框创建日期选择器：

$(document).ready(function(){
    $('input.datepicker').datepicker({ /*... pass options here ...*/ });
});

对于选项，您阅读文档，其中包括处理您需要的所有事件：

http://api.jqueryui.com/datepicker/

Answer 3

调用函数：

onclick="someFunction(this);"

设定功能：

function someFunction(this) {
    $(this).prev('.input-group.date').datepicker({});
}

Answer 4

您将datepicker绑定到DOM元素，而不是onClick 。

$(document).ready(function(){
    $('.form-control').datepicker({});
});

或者在功能中添加它，以便您可以动态调用它。

Answer 5

把这组代码放在一个javascript函数中说clickMe（）

function clickMe(){
$('.input-group .date').datepicker({
    });
}

现在在click方法中调用该函数。

<div class="input-group date" id="dp3">
<input class="form-control" type="text"  placeholder="Date" name="date" value="" onclick="clickMe()">
</div>