现在我有一个 dropDownList,它是一个带有“Option”元素的“Select”HTML 控件,并且已经在“server”处运行,代码如下:
<select name="webmenu" id="webmenu" class="fWidth" runat="server">
<option value="calendar" data-image="TempImages/AldiBl.png">Aldi</option>
<option value="shopping_cart" data-image="TempImages/Norma.png">Norma</option>
<option value="cd" data-image="TempImages/AldiBl.png">Aldi</option>
<option value="email" selected="selected" title="TempImages/AldiBl.png">Aldi</option>
<option value="fam" data-image="TempImages/AldiBl.png">Aldi</option>
<option value="games" data-image="TempImages/AldiBl.png">Aldi</option>
</select>
我可以从后面的代码访问包含元素的列表,但我的问题是我需要动态添加元素,上面的只是一个示例,为此我有一个添加元素的 javascript 函数,这里是是:
function showAccounts(names, images) {
var namesArray = names.split(",");
var imagArray = images.split(",");
for (var ro = 0; ro < namesArray.length; ro++) {
$('#menuName').append($("<option value='" + namesArray[ro] + "' data-image='" + imagArray[ro] + "'>" + namesArray[ro] + "</option>"));
}
return false;
}
元素被很好地添加和显示,但是当从后面的代码访问时,它们不存在于列表中,我可以理解,因为它们是在客户端创建的,所以这是我的问题,如何将带有图像的元素添加到我的“从代码隐藏中选择“元素,以便我可以从代码隐藏中访问它们?
提前非常感谢。
最佳答案
试试这个:
private ListItem CreateListItem(string value, string text, string dataImage) {
ListItem li = new ListItem() { Value = value, Text = text };
li.Attributes["data-image"] = dataImage;
return li;
}
protected void Page_Load(object sender, EventArgs e) {
List<ListItem> lis = new List<ListItem>();
lis.Add(CreateListItem("test1", "blah1", "test.png"));
lis.Add(CreateListItem("test2", "blah2", "test2.png"));
lis.Add(CreateListItem("test3", "blah3", "test3.png"));
if (!IsPostBack) {
foreach (ListItem li in lis)
webmenu.Items.Add(li);
}
else {
// persist custom attributes
for (int i = 0; i < webmenu.Items.Count; i++)
webmenu.Items[i].Attributes["data-image"] = lis[i].Attributes["data-image"];
}
}
在回发时,您可以使用 webmenu.SelectedItem.Value 和 webmenu.SelectedItem.Attributes["data-image"] 检索值
关于javascript - 如何添加带有图像的选项以在页面加载期间进行选择?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38432638/