bootstrap形式帮手电话不会在ajax数据中工作

时间:2014-07-02 06:27:32

标签: javascript jquery twitter-bootstrap bootstrap-form-helper

我的Bootstrap手机表单助手工作正常,但当我尝试使用jQuery / javascript添加更多文本框时,它不起作用。

使用普通表格:

<div class="n_g_p_pop" id="mainprice">
    <label> 
        <span id="base_rental">Base rental rate</span> 
        <i class="gn_icon8" title="Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo."></i>
    </label>
    <input type="text" value="" placeholder="$" id="base_rental_rate" class="bfh-phone" data-format="$dddd"/>
    <div class="clear"></div>
</div>

on添加更多按钮单击(Bootstrap手机表单不工作)

var id = 101;
function add_extra()  {
    var data = '<div id="new_element_' + id + '" class="month_int_b"><div class="gn_b_1"> <i class="gn_icon12"></i><div class="gn_b_1_i"><input type="text" value="" placeholder="$" class="bfh-phone" data-format="$dddd" /></div></div><div class="gn_b_1"> <i class="gn_icon12"></i><div class="gn_b_1_i"><input type="text" value="" placeholder="$" class="bfh-phone" data-format="$dddd"/></div></div><div class="gn_ad_m1"><a href="javascript:void(0);" onclick="remove_extra(' + id + ')"></a></div><div class="clear"></div></div>';
    id++;
    $('#add_new_element').append(data);
}

谢谢

1 个答案:

答案 0 :(得分:3)

在将bfh控件添加到DOM后,需要手动初始化bfh控件。 它有点乱,他们真的可以给我们一个init()函数或者其他东西。无论如何,这应该工作:

$('form input[type="text"].bfh-phone, form input[type="tel"].bfh-phone, span.bfh-phone').each(function() {
   var $phone = $(this);
   $phone.bfhphone($phone.data());
});