当前位置：文江博客话题详情

javascript 和 asp.net Web 用户控件

发布于 2024-07-18 19:21:55 字数 1781 浏览 7 评论 0原文

我有一个 Web 用户控件，可以在客户端上生成以下 html。

我想使用 JavaScript 引用特定的 RadioButton 控件。

我不知道如何执行此操作，因为 RadioButton ID 是由 asp.net 生成的。

例如，我给RadioButton ID = 1_RadioButton

asp.net生成一个ID = ctl00_ContentPlaceHolder1_Material_1_RadioButton

这个javascript代码如何找到Radio Button控件？

    <script type="text/javascript">
        $(document).ready(function() {
            if (document.getElementById("1_RadioButton").checked) {
                $("#1_other").hide();
            }
        });    
    </script>

以下是 asp.net 为客户端生成的内容。

    <input id="ctl00_ContentPlaceHolder1_Material_1_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="1_RadioButton" onclick="javascript:$('#1_other').show('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_1_RadioButton">Yes</label>

    <input id="ctl00_ContentPlaceHolder1_Material_2_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="2_RadioButton" checked="checked" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_2_RadioButton">No</label>

    <input id="ctl00_ContentPlaceHolder1_Material_3_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="3_RadioButton" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_3_RadioButton">Uncertain</label>

    <div id='1_other'>
         <input name="ctl00$ContentPlaceHolder1$Material$4_TextBox" type="text" value="bbb chabng" id="ctl00_ContentPlaceHolder1_Material_4_TextBox" />
   </div>

原文

I have a web user control that generates the following html on the client.

I want to reference a specific RadioButton control using JavaScript.

I am not sure how to do this as the RadioButton ID is generated by asp.net.

For example I give the RadioButton ID = 1_RadioButton

asp.net generates an ID = ctl00_ContentPlaceHolder1_Material_1_RadioButton

how can this javascript code find Radio Button controls?

    <script type="text/javascript">
        $(document).ready(function() {
            if (document.getElementById("1_RadioButton").checked) {
                $("#1_other").hide();
            }
        });    
    </script>

The following is what asp.net generates for the client.

    <input id="ctl00_ContentPlaceHolder1_Material_1_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="1_RadioButton" onclick="javascript:$('#1_other').show('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_1_RadioButton">Yes</label>

    <input id="ctl00_ContentPlaceHolder1_Material_2_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="2_RadioButton" checked="checked" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_2_RadioButton">No</label>

    <input id="ctl00_ContentPlaceHolder1_Material_3_RadioButton" type="radio" name="ctl00$ContentPlaceHolder1$Material$Academic" value="3_RadioButton" onclick="javascript:$('#1_other').hide('fast');" />

    <label for="ctl00_ContentPlaceHolder1_Material_3_RadioButton">Uncertain</label>

    <div id='1_other'>
         <input name="ctl00$ContentPlaceHolder1$Material$4_TextBox" type="text" value="bbb chabng" id="ctl00_ContentPlaceHolder1_Material_4_TextBox" />
   </div>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

镜花水月 2024-07-25 19:21:55

如果该代码位于 .aspx 文件中，请使用 <%= MyRadioButton.ClientID %> ASP.NET 渲染引擎将正确地为您渲染 ID。

更新： 例如：

<script type="text/javascript">
    $(document).ready(function() {
        if ($get("<%= MyRadioButton.ClientID %>").checked) {
            $("#1_other").hide();
        }
    });    
</script>

If that code is in the .aspx file use <%= MyRadioButton.ClientID %> in its place and the ASP.NET rendering engine will properly render the ID for you.

Update: For example:

<script type="text/javascript">
    $(document).ready(function() {
        if ($get("<%= MyRadioButton.ClientID %>").checked) {
            $("#1_other").hide();
        }
    });    
</script>

回复收藏 0 原文

我三岁 2024-07-25 19:21:55

var radioButton = document.getElementById("<%= 1_RadioButton.ClientID %>");

然后从那里开始。注意 - 我对引号并不肯定。

var radioButton = document.getElementById("<%= 1_RadioButton.ClientID %>");

And then go from there. Note - I'm not positive about the quotation marks.

回复收藏 0 原文

红玫瑰 2024-07-25 19:21:55

我写了一篇关于如何执行此操作的博客文章：

假设你有一个标签控件
您的页面：
生成的html输出和
该控件的 ID 可能类似于
这个：

<span id="ctl00_ContentPlaceHolder1_Label1"></span>

不幸的是，生成的 ID
ct100_ContentPlaceHolder1_Label1 不是
构建时总是相同的
建造。所以尝试选择它
这个：
$("#ct100_ContentPlaceHolder1_Label1").hide();
最终会破裂，但不会
隐藏标签控件。
诀窍是在内部使用 ASP.NET
jQuery 选择器。 Label1.ClientID 将
每次都返回生成的ID。我们
将 ASP.NET 和 jQuery 合二为一
像这样的行：
$("#<%= Label1.ClientID %>").hide();
这将获取生成的 ID
每次都进行标签控制。

I had written a blog post on how to do this:

So say you have a label control on
your page:
The generated output of the html and
the ID of that control might look like
this:

<span id="ctl00_ContentPlaceHolder1_Label1"></span>

Unfortunately the generated ID of
ct100_ContentPlaceHolder1_Label1 isn't
always going to be the same from build
to build. So trying to select it like
this:
$("#ct100_ContentPlaceHolder1_Label1").hide();
will eventually break and it won't
hide the label control.
The trick is to use ASP.NET inside the
jQuery selector. Label1.ClientID will
return the generated ID everytime. We
combine ASP.NET and jQuery into one
line like this:
$("#<%= Label1.ClientID %>").hide();
This will get the generated ID of the
Label control everytime.