Jquery mobile jQuery移动页脚中的动态按钮？

在JQM页脚中动态注入按钮似乎是一个令人沮丧的练习。有人知道如何对此应用正确的格式吗？以下是我在尝试这样做时发现的几个异常情况：

---

• 页脚中的多列按钮网格格式不正确

• data corners=“false”属性（用于获取刷新按钮）不适用于页脚中的第一个和最后一个按钮

• 对于页脚按钮，使用data role=“controlgroup”data type=“horizontal”，如果有太多的按钮无法容纳在一行中，则样式看起来很奇怪（因为一些按钮将具有圆角，而其他按钮则不会）

• 如果页脚按钮省略了data role=“controlgroup”data type=“horizontal”，则按钮可能会部分呈现在屏幕外

总的来说-啊！！！！有人成功地将按钮动态注入页脚吗？如果是这样的话，我将非常高兴听到这是如何实现的。

---

谢谢

页脚中的多列按钮网格格式不正确-这是我对此的回应

有一件事需要检查您是否使用带有a href链接的controlgroup-确保控制组中的每个链接都有以下CSS

vertical-align:top;

如果要将元素设计为按钮，还必须对元素的外观进行更多控制。我在这里发布了类似的讨论：

---

希望对您有所帮助。

希望您喜欢这项工作：

JS

$（'addButtonName'）。单击（函数（）{
var theFooter=$（“#添加更多按钮”）；
var buttonName=$（'newButtonName'）；
if（buttonName.val（）！=“”）{
footer.append（“”）；
按钮名称val（“”）；
$（“#主页”）.trigger（'create'）；
}
});

HTML

按钮名称：

谢谢。我想我只是在页脚的按钮上遇到了一些特殊情况——这是因为我的动态变化。我现在看到的是，页脚按钮有时会在屏幕右侧溢出一点-如果您逐渐调整结果JQM面板的大小，您可以很容易地看到它。正文中的常规内联按钮不会出现这种情况（只是尝试了一下）。此外，我在html中有一个预定义的按钮，并添加了更动态的按钮。结果是，JQM在第一个预定义的页脚按钮后放置了更多的空间，但如果该按钮是动态插入的，则不会如此……hmmm逐渐调整JQM面板的宽度，并看到页脚右侧的丑陋（最右侧按钮中的最后一个字符被切掉）。动态添加按钮时会发生这种情况。可能会添加一些填充？观点？我将对此进行讨论，另一个例子是：在我之前的评论中给出的例子中，class=“ui bar”是罪魁祸首。如果从页脚中删除此类，则右侧不会出现溢出。至于你最新的例子-只是检查一下，你看到额外的填充后，第一个按钮-对吗？

$('#addButtonName').click(function() {
    var theFooter = $('#addMoreButtons');
    var buttonName= $('#newButtonName');

    if(buttonName.val() != '') {
        theFooter.append('<a href="#" data-role="button" data-icon="delete">'+buttonName.val()+'</a>');
        buttonName.val('');
        $('#theHomePage').trigger('create');  
    }
});

<div data-role="page" id="theHomePage">
    <label for="basic">Button Name:</label>
    <input type="text" name="newButtonName" id="newButtonName" value="" />
    <a href="#" data-role="button" id="addButtonName">Add New button</a>
    <div data-role="footer" class="ui-bar" id="addMoreButtons">
    </div>
</div>