<select> <option>里头为啥不能放<img src='imagePath' />
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了<select> <option>里头为啥不能放<img src='imagePath' />相关的知识,希望对你有一定的参考价值。
参考技术A select 里面只能是option.带图片的下拉菜单都是用javascript模拟的。网上有类似的代码。一搜就可以搜到本回答被提问者采纳
jquery 如何去除select 控件重复的option
比如
<select >
<option>1 </option>
<option>1 </option>
<option>2 </option>
<option>2 </option>
<option>3</option>
</select>
要变成
<select >
<option>1 </option>
<option>2 </option>
<option>3</option>
</select>
如何做,请给个示例
这个问题最好应该在后台中处理掉——创建select元素之前就过滤掉重复的元素。如果必须要在页面中处理,方法也比较多,这里提供一个使用jquery选择器 :contains 的方法:
$(":contains(text)"); // 选取包含指定字符串的元素这样就可以选出包含重复字符串的option元素,然后将其删掉
示例代码如下
创建Html元素
<div class="box"><span>点击按钮删除select控件中的重复元素:</span><br>
<div class="content">
<select >
<option>1</option>
<option>1</option>
<option>2</option>
<option>2</option>
<option>3</option>
</select>
</div>
<input type="button" value="删除重复项">
</div>
设置css样式
div.boxwidth:300px;padding:20px;margin:20px;border:4px dashed #ccc;div.box spancolor:#999;font-style:italic;
div.contentwidth:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;
selectwidth:150px;height:30px;margin:5px 0;border:1px solid #6699FF;
input[type='button']height:30px;margin:10px;padding:5px 10px;
编写jquery代码
$(function()$(":button").click(function()
$("select option").each(function()
text = $(this).text();
if($("select option:contains("+text+")").length > 1)
$("select option:contains("+text+"):gt(0)").remove();
);
);
)
观察效果
初始状态
点击按钮删除重复项之后
2.将所有的值放入数组去除重复数据,再更新select子节点 参考技术B $("select").each(function(i,n)
var options = "";
$(n).find("option").each(function(j,m)
if(options.indexOf($(m)[0].outerHTML) == -1)
options += $(m)[0].outerHTML;
);
$(n).html(options);
);
这个是循环所有select,查找每个select,并重新给select的html赋值本回答被提问者和网友采纳 参考技术C <!-- 徐士刚jquery实现异步三级联动 -->
<script type="text/javascript">
var flagflag = false;
$(function()
$.post("dropdownlist!selectAllProvinceCityTown.action",function(data)
var json=eval(data);
for(var i = 0,len = json.length; i<len; i++)
if($==json[i].id)
$('#cityid').empty();
$('#cityid').append("<option value=\"\">---请选择---</option>");
$('#townid').empty();
$('#townid').append("<option value=\"\">---请选择---</option>");
$('#provinceid').append($("<option value='"+json[i].id+"' selected='selected'>"+json[i].name+"</option>"));
querycitybyprovince();
else
$('#provinceid').append($("<option value='"+json[i].id+"'>"+json[i].name+"</option>"));
,"json");
$('#provinceid').change(function()
$('#cityid').empty();
$('#cityid').append("<option value=\"\">---请选择---</option>");
$('#townid').empty();
$('#townid').append("<option value=\"\">---请选择---</option>");
querycitybyprovince();
);
);
function querycitybyprovince()
var provinceid = document.getElementById('provinceid').value;
if(provinceid==1)
provinceid = -1;
$.post("dropdownlist!selectAllProvinceCityTown.action",,function(data)
var json=eval(data);
for(var i = 0,len = json.length; i<len; i++)
if($==json[i].id)
$('#townid').empty();
$('#townid').append("<option value=\"\">---请选择---</option>");
$('#cityid').append($("<option value='"+json[i].id+"' selected='selected'>"+json[i].name+"</option>"));
querytownbycity();
else
$('#cityid').append($("<option value='"+json[i].id+"'>"+json[i].name+"</option>"));
$('#cityid').change(function()
//clearOptions(document.getElementById('townid'));
//$('#townid').empty();
$('#townid').empty();
$('#townid').append("<option value=\"\">---请选择---</option>");
querytownbycity();
,"json");
);
function querytownbycity()
var cityid = document.getElementById('cityid').value
$.post("dropdownlist!selectAllProvinceCityTown.action",,function(data)
var json=eval(data);
$('#townid').empty();
$('#townid').append("<option value=\"\">---请选择---</option>");
for(var i = 0,len = json.length; i<len; i++)
if($==json[i].id)
$('#townid').append($("<option value='"+json[i].id+"' selected='selected'>"+json[i].name+"</option>"));
else
$('#townid').append($("<option value='"+json[i].id+"'>"+json[i].name+"</option>"));
,"json");
页面端:
<select name="provinceid" class="bk_01" id="provinceid"
style="WIDTH: 120px">
<option value="1">
---请选择---
</option>
</select>
<select name="cityid" class="bk_01" id="cityid"
style="WIDTH: 120px">
<option value="">
---请选择---
</option>
</select>
<select name="townid" class="bk_01" id="townid"
style="WIDTH: 120px">
<option value="">
---请选择---
</option>
</select>
希望对你有帮助,希望及时采纳,谢谢!
以上是关于<select> <option>里头为啥不能放<img src='imagePath' />的主要内容,如果未能解决你的问题,请参考以下文章