总结--JQuery篇（想点写点）

最新推荐文章于 2022-03-15 15:53:20 发布

ring0li

最新推荐文章于 2022-03-15 15:53:20 发布

阅读量878

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/ring0li/article/details/9718593

本文介绍了使用JavaScript动态生成重复的HTML结构，并演示了如何通过jQuery获取select元素的选中项。提供了两种方法：一是利用字符串拼接实现多次生成相似的HTML块；二是通过clone()方法复制带有特定ID的元素并修改其属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，获取select选中项

$('#year').find('option:selected');

2,动态生成多项相同html时候

for循环里要写好多“+”，累

  var str = "";
    for (i = 1; i < h; i++) {
        str += '  <div class="main_03_01">' +
                '<div class="main_03_01_top">' +
                '<span class="tb_bg">Room 0' + i + '</span>' +
                '<div class="tb_right">' +
                '面积:<input type="text" id="' + i + '_use_area" name="' + i + '_use_area" width="50" class="home_name size">' +
                ' 朝向:<select id="' + i + '_station" name="' + i + '_station" style=" border:1px solid #a2afbf;">' +
  .....省略
                '</div>';
    }
    $("#room").html(str);

把html设为display:none，clone()吧

for (var i = 1; i <= end; i++) {
                var copy = $("#copy_room").clone();
                copy.find(".p_arr").html('Room 0' + i);
                copy.find(".use_area").attr('name', i + '_user_area').attr('id', i + '_user_area');
                copy.find(".station").attr('name', i + '_station').attr('id', i + '_station');
                $("#room").append(copy.html());
}