2

我的 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>

添加更多按钮单击（引导电话表单不起作用）

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);
}

谢谢

4

1 回答 1

3

将 bfh 控件添加到 DOM 后，您需要手动初始化它。这有点乱，他们真的可以给我们一个 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());
});
于 2014-11-19T19:29:44.607 回答