当新的选择框被添加到页面中时,重新应用jQuery选择框样式

Re-apply jQuery select box styling when new select box is added to page

本文关键字:选择 新应用 应用 jQuery 样式 添加      更新时间:2023-09-26

我的jQuery选择框样式在初始页面加载时起作用,但是当包含选择框的内容被动态加载到页面中时,样式不会应用于它。

确保新选择框在加载到页面上时就会有样式的最好方法是什么?

jQuery(document).ready(function() {
    jQuery.jStyling.createSelect(jQuery('select'));
});

我在动态制作带颜色交替的表格时遇到过这个问题,我是这样做的:

工作小提琴

HTML:

<input id="add" type="button" value="Add Box"></input>
<div class="styled">BOX</div>
JavaScript:

function addStyle() {
    $(".styled").css({
        "width": "100px",
        "height": "100px",
        "background": "#ff0000"
    });
};
$(document).on("click", "#add", function () {
    var myBox = $("<div>");
    myBox.addClass("styled");
    myBox.text("BOX");
    myBox.appendTo($("body"));
    addStyle();
});
addStyle();

尝试使用CSS代替jQuery

select {
    //Styling
}

或者根据需要按类或id。

.classOfSelect {
    //Styling
}