Jquery添加HTML元素问题

2015-07-27 05:37:06 241 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

Tessent ICL语法详解：如何高效定义SIB、TDR和TAP模块本文深入解析Tessent ICL语法，指导如何高效定义SIB、TDR和TAP模块以构建芯片测试网络。通过实战代码示例，详细阐述了各模块的端口声明、接口角色与核心寄存器定义，并提供了顶层集成连接方法与调试技巧，帮助DFT工程师精准描述测试仪器拓扑，提升Tessent工具链使用效率。阅读详情

$('.btn-box input').click(function(){

			var person=$.trim($("#person").val());

			var phoneNo=$.trim($("#phoneNo").val());

			var zipCode=$.trim($("#zipCode").val());

			var distinct=$.trim($("#distinct").val());

			var addrDetail=$.trim($("#addrDetail").val());



			if(!checkEmpty(person,"收货人"))

			{

				return false;

			}

			if(!checkMobile(phoneNo))

			{

				return false;

			}

			if(!checkZipcode(zipCode))

			{

				return false;

			}

			if(!checkEmpty(distinct,"所在区域"))

			{

				return false;

			}

			if(!checkEmpty(addrDetail,"详细地址"))

			{

				return false;

			}

			

			$('.addrlist li').removeClass("selected");

			// var str ='<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>';

			// var $htmlLi = $(” <li class="selected"> <div class="name">+person+</div> <div class="tel">+phoneNo+</div> <div class="addr">+addrDetail+</div> </li>”);  //创建DOM对象

			// var $htmlLi = $('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');  //创建DOM对象



			$('.addrlist').show();



			 $('.addrlist ul').append('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');

			 //location.reload();

			

            //刷新页面

             



			$('.uc-my').hide();

		});

问题一：为什么单机事件执行完，添加的HTML元素又不见了，在断点中可以看到“li”元素添加上了啊？？？ Why？？？

问题二：给元素添加HTML元素，必须要先show出来才可以？？？

问题三：添加的HTML元素，貌似“class="selected"”不起作用，为了使它起作用，应该怎么办？？？

...全文

将ue4程序嵌入qt界面显示需求：将ue4程序嵌入qt界面显示思路：通过使用 windowsAPI 对ue4窗口进行设置跟随qt界面以及活动窗口时的位置层序设置阅读详情

starrycheng

JavaScript 87,984 成员 224,681 内容

+ 关注 + 加入社区

切换为时间正序

离子漂浮物 2015-07-28

打赏
举报

呃，上面的"."+key写错了，应该是"."+k

离子漂浮物 2015-07-28

打赏
举报

引用 5 楼 starrycheng 的回复:

难道是自己太马虎，多写了一个ul，选择器$('.addrlist')用法不对？？？

没什么不对，只是使用习惯而以，对于你这个代码我更习惯于反过来写，你那段代码我应该会写成下面这样


        function createLi(d) {
            var li = $('<li class="selected"><div class="name"></div> <div class="tel"></div> <div class="addr"></div></li>').appendTo(".addrlist");
            $.each(d, function (k, v) { li.find("." + key).html(v); });
        }
        createLi({ name: person, tel: phoneNo, addr: addrDetail });

hch126163 2015-07-28

打赏
举报

用开发人员工具，审查元素去看 js 创建的dom 去分析是css 问题还是 html 结构问题

starrycheng 2015-07-28

打赏
举报

引用 4 楼 oyiboy 的回复:

首先，我不知道是不是我复制这个代码的问题，我发现下面这行代码里的空格全是全角的，如果你的源代码也是全角的请换个半角的。
$('.addrlist ul').append('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');
然后，addrlist本身就是ul，我想你的目的是在ul里添加东西是吧？所以代码应该是这样
$('.addrlist').append('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');
而你那个代码的意思是在.addrlist下面的ul里添加li了。最后，你那个“class="selected"”不起作用是不是真的是全角空格的问题。

难道是自己太马虎，多写了一个ul，选择器$('.addrlist')用法不对？？？

离子漂浮物 2015-07-27

打赏
举报

首先，我不知道是不是我复制这个代码的问题，我发现下面这行代码里的空格全是全角的，如果你的源代码也是全角的请换个半角的。


$('.addrlist ul').append('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');

然后，addrlist本身就是ul，我想你的目的是在ul里添加东西是吧？所以代码应该是这样


$('.addrlist').append('<li class="selected"> <div class="name">'+person+'</div> <div class="tel">'+phoneNo+'</div> <div class="addr">'+addrDetail+'</div> </li>');

而你那个代码的意思是在.addrlist下面的ul里添加li了。最后，你那个“class="selected"”不起作用是不是真的是全角空格的问题。

starrycheng 2015-07-27

打赏
举报

<div class="btn-box"><input type="button" value="添加"></div> 有默认行为吗？？？

starrycheng 2015-07-27

打赏
举报

引用 1 楼 showbo 的回复:

input是什么类型的，不会是submit吧，导致表单提交了

button类型的。。。 <ul class="addrlist"> <li class="selected"> <div class="name">李希加</div> <div class="tel">1324679131</div> <div class="addr">上海市浦东新区潍坊新村街道浦电路149弄32号201室</div> </li> <li> <div class="name">李希加</div> <div class="tel">1324679131</div> <div class="addr">上海市浦东新区潍坊新村街道浦电路149弄32号201室</div> </li> <li> <div class="name">李希加</div> <div class="tel">1324679131</div> <div class="addr">上海市浦东新区潍坊新村街道浦电路149弄32号201室</div> </li> <li> <div class="name">李希加</div> <div class="tel">1324679131</div> <div class="addr">上海市浦东新区潍坊新村街道浦电路149弄32号201室</div> </li> </ul> <div class="uc-my" style="display:none"> <ul> <li class="flexbox"> <div class="cap">收货人</div> <div class="input-box"><input id="person"></div> </li> <li class="flexbox"> <div class="cap">手机号码</div> <div class="input-box"><input id="phoneNo"></div> </li> <li class="flexbox"> <div class="cap">邮政编码</div> <div class="input-box"><input id="zipCode"></div> </li> <li class="flexbox"> <div class="cap">所在地区</div> <div class="input-box"><input id="distinct"></div> </li> <li class="flexbox"> <div class="cap">详细地址</div> <div class="input-box"><input id="addrDetail"></div> </li> </ul> <div class="btn-box"><input type="button" value="添加"></div> </div>

斯洛文尼亚旅游 2015-07-27

打赏
举报

input是什么类型的，不会是submit吧，导致表单提交了

Jquery添加HTML元素问题

相关推荐