首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Grails和Jquery数据报警器

Grails和Jquery数据报警器
EN

Stack Overflow用户
提问于 2016-05-15 14:55:27
回答 2查看 162关注 0票数 3

我想要写一段代码,允许我创建输入,例如主题、购买日期和资产价值,输入框中有'class =“datepicker‘属性,并且在开始时,所有内容都能正常读取,但是当我调用这些作品在页面中添加其他输入(与上面一样)时,"datepicker”不再给出任何生命迹象。我给你看密码:

代码语言:javascript
代码运行次数:0
运行
复制
    <div class="well bs-component" ><fieldset><div id="elencoBeni">
        <div class="input-group">
            <span class="input-group-addon">Oggetto</span>
            <g:textField class="form-control" placeholder="Oggetto" name="oggetto" id="oggetto" />
            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar" ></span></span>
            <g:textField class="form-control datepicker" placeholder="Data acquisto" name="dataAcquisto" id="dataAcquisto" />
            <span class="input-group-addon">Valore</span>
            <g:textField class="form-control" placeholder="Valore" name="valoreBene" id="valoreBene"/><br/>
        </div><br/>
    </div>
        <label class="btn btn-success" id="aggiungiOggetto" name="aggiungiOggetto"  >+</label>
    </fieldset></div>

jquery函数:

代码语言:javascript
代码运行次数:0
运行
复制
<g:javascript>
$(document).ready(function(){
        $('.datepicker').datepicker({
              language: 'it'
        });    var i = 0;
        $("#aggiungiOggetto").click(function(){
            $("#elencoBeni").append('<div class="input-group"><span class="input-group-addon">Oggetto</span><input type="text" class="form-control" placeholder="Oggetto" name="oggetto'+i+'"  id="oggetto'+i+'"/><span class="input-group-addon"><span class="glyphicon glyphicon-calendar" ></span></span><input type="text" class="datepicker form-control" placeholder="Data acquisto" name="dataAcquisto'+i+'" id="dataAcquisto'+i+'"/><span class="input-group-addon">Valore</span><input type="text" class="form-control" placeholder="Valore" name="valoreBene'+i+'" id="valoreBene'+i+'"/><br/></div><br/>');

            i++
        });     </g:javascript>          
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2016-05-15 14:58:27

由于输入是动态添加到dom中的,因此在将元素添加到dom后,需要初始化元素的datepicker。

代码语言:javascript
代码运行次数:0
运行
复制
$(document).ready(function() {
  $('.datepicker').datepicker({
    language: 'it'
  });
  var i = 0;
  $("#aggiungiOggetto").click(function() {
    $("#elencoBeni").append('<div class="input-group"><span class="input-group-addon">Oggetto</span><input type="text" class="form-control" placeholder="Oggetto" name="oggetto' + i + '"  id="oggetto' + i + '"/><span class="input-group-addon"><span class="glyphicon glyphicon-calendar" ></span></span><input type="text" class="datepicker form-control" placeholder="Data acquisto" name="dataAcquisto' + i + '" id="dataAcquisto' + i + '"/><span class="input-group-addon">Valore</span><input type="text" class="form-control" placeholder="Valore" name="valoreBene' + i + '" id="valoreBene' + i + '"/><br/></div><br/>');

    // initialize datepicker again, which includes the dynamically added element
    $('.datepicker').datepicker({
      language: 'it'
    });

    i++
  });
});
票数 2
EN

Stack Overflow用户

发布于 2016-05-15 15:07:08

因为新元素没有绑定.datepicker()

而不是:

代码语言:javascript
代码运行次数:0
运行
复制
$('.datepicker').datepicker({
      language: 'it'
});

用途:

代码语言:javascript
代码运行次数:0
运行
复制
$('body').on('focus',".datepicker", function(){
    $(this).datepicker({
      language: 'it'
    });
});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37239777

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档