添加 runat=服务器会从选择控件中删除样式

本文关键字：控件 删除 样式 选择 runat 服务器 添加 | 更新日期: 2023-09-27 18:30:55

我正在尝试使用此控件并能够从代码后端（cs文件）访问它。我从下面的代码开始，它有效：

   $(document).ready(function () {
       $("#foundImages").imagepicker({
           hide_select: true,
           show_label: true
       });
   });


<select id="foundImages" class="image-picker show-labels show-html">
    <option data-img-label="Awww" data-img-src="http://placekitten.com/220/200" value="1">Cute Kitten 1</option>
    <option data-img-label="Yeah" data-img-src="http://placekitten.com/180/200" value="2">Cute Kitten 2</option>
    <option data-img-label="Ohai" data-img-src="http://placekitten.com/130/200" value="3">Cute Kitten 3</option>
    <option data-img-label="Plop" data-img-src="http://placekitten.com/270/200" value="4">Cute Kitten 4</option>
</select>

但是当我向它添加runat="server"，以便我可以从.cs文件访问它时，拖放控件看起来就像一个标准的组合框。知道为什么在添加runat="server"时删除样式 - 或者有没有另一种方法可以从我的 cs 文件访问 <select> 控件？

谢谢！

添加 runat=服务器会从选择控件中删除样式

如果将runat="server"添加到选择中，则会将其转换为服务器端控件。在这种情况下，生成的 HTML 选择的 ID 将被foundImages.ClientID（您可以使用查看源代码进行检查）。这意味着您必须更改此行：

$("#foundImages").imagepicker({

有了这一行：

$("#<%=foundImages.ClientID%>").imagepicker({

除了 'runat="server"' ，请尝试添加 'clientidmode="Static"' 。

有时，ASP.NET会改变你的ID，所以你的CSS和JavaScript可能看起来坏了。但是，通过将客户端 ID 模式设置为 'Static' ，您将强制ASP.NET保留您的 ID。

从其他答案开始，正确说明 ID 可能会更改（除非设置了ClientIDMode），解决您看到的问题的最简单方法是改用元素的 CSS 类。

您已经将类image-picker分配给了下拉列表，因此没有理由不执行以下操作：

$(document).ready(function () {
   $(".image-picker").imagepicker({
       hide_select: true,
       show_label: true
   });
});

首先使用它进行控制

'clientidmode="Static"'

然后像这样从脚本获取控制权

$("#<%=img.ClientID%>").imagepicker({...});
相关文章：