layer.open({ type: 1, skin: 'layui-layer-rim', //Add borders area: ['350px','400px'], //Width height // btn: ['Submit','Cancel'], content: "<div id='addwin'><table align='center'style='margin-top: 5px;'>" +"<tr>" +"<td>Place classification:</td>" +"<td><select id='locSel' name='locSel'>" +"<option value ='0'>whole</option>" +"</select></td>" +"</tr>" +"<tr>" +"<td>Place code:</td>" +"<td><input type='text' id='localeCode'></td>" +"</tr>" +"<tr>" +"<td>Place name:</td>" +"<td><input type='text' id='localeName'></td>" +"</tr>" +"<tr>" +"<td>Store address:</td>" +"<td><input type='text' id='localeadd'></td>" +"</tr>" +"</table></div>", btn: ['Submission', 'cancel'] ,yes: function(index, layero){ var locSel =$("#locSel").val(); var localeCode =$("#localeCode").val(); var localeName =$("#localeName").val(); var localeadd =$("#localeadd").val(); alert(locSel); addlcoale(localeType); } ,btn2: function(index, layero){ layer.close(index); } }) for(var i =0;i<type_arr.length;i++){ var opt = type_arr[i]; $("#locSel").append("<option value='"+opt.type_id+"'>"+opt.type_name+"</option>"); }
Recently, using layer plug-in as the front-end pop-up box, I wanted to create a select drop-down box with js in content. At first, I didn't want to write js code directly in content. Because I used hi splicing html code to achieve content that jumped out of the box. I thought there was nothing wrong with this, but I fooled, the whole method body collapsed directly.
Later, I looked for the information and solved this small problem.
Solution: Stitching html code in content as usual. When splicing, create a < select id ='selectId'> </select > and then get the selection below (preferably after the layer.open method), and then loop through adding option s to select. The code went up, not very well.