【问题标题】:html element not working inside radio button listhtml元素在单选按钮列表中不起作用
【发布时间】:2015-03-11 04:05:18
【问题描述】:

我有单选按钮列表,在其中一个项目列表中我有 html input type="text"。

当我选择带有输入文本字段的选项,然后单击文本字段时,焦点会丢失,焦点会转移到选中的单选按钮列表项。

这是我想要实现的显示

当我点击“经销商名称”时,焦点转移到经销商单选按钮,因此用户无法输入“经销商名称”

上述行为发生在 Firefox 中。在 Chrome 中它不会导致任何问题

更新

这是我在选择索引更改时使用的代码

$("#rOD").change(function () {
        if ($("#rOD input:checked").val() == "Dealer") { $("#txtDName").removeAttr("disabled"); }
        else { $("#txtDName").attr("disabled", "disabled"); }
    });

我已经尝试使用以下代码来改变焦点

function fc(elem) {
        $("#rOD").focusout();
        $(elem).focus();
    }

这是标记

<asp:RadioButtonList Font-Size="Small" ID="rOD" data-toggle="popover" title="Field required"
        data-content="Please Select" ClientIDMode="Static" runat="server"
        RepeatDirection="Vertical">
        <asp:ListItem Text="Owner" Value="Owner">Owner</asp:ListItem>
        <asp:ListItem Text="Dealer" Value="Dealer">Dealer&nbsp <input type="text" id="txtDName" onclick="return fc(this);" placeholder="Dealer Name" disabled="disabled" data-toggle="popover" title="Field required" data-content="Please Select" style="width:150px"  /> </asp:ListItem>
    </asp:RadioButtonList>

【问题讨论】:

  • 您的代码在哪里?并发布一个 jsfiddle
  • 请出示您的代码,
  • @gulty 我已经用代码更新了我的问题
  • @securedeveloper 用代码更新了我的问题

标签: javascript jquery html asp.net radiobuttonlist


【解决方案1】:

试试这个jQuery 代码:-

$("#rOD").click(function (e) {
    $("#rOD input:checked").next().find('input').focus();
});
$("#rOD").change(function (e) {
    if ($("#rOD input:checked").val() == "Dealer") {
        $("#txtDName").removeAttr("disabled");
        e.preventDefault();
    } else { 
        $("#txtDName").attr("disabled", "disabled"); 
    }
});

【讨论】:

    【解决方案2】:

    使用此代码,

    $(document).ready(function () {
      $("#rOD").change(function () {
        if ($("#rOD input:checked").val() == "Dealer") { $("#txtDName").removeAttr("disabled"); $("#txtDName").focus(); }
        else { $("#txtDName").attr("disabled", "disabled"); }
       });
    });
    
    function fc(elem) {
       $(elem).focus();
    }
    

    结果如下,

    【讨论】:

    • 您从问题中复制了代码。你没有改变任何东西
    • 我刚刚把你的一段代码放到$(document).ready(function(){});函数中,
    • 先阅读问题。我说它在Firefox中不起作用。它在其他浏览器中工作
    • 我更改了我的代码,现在它在 fire fox 上运行良好,(竖起大拇指!)
    猜你喜欢
    • 2011-05-03
    • 1970-01-01
    • 1970-01-01
    • 2015-12-11
    • 1970-01-01
    • 1970-01-01
    • 2014-11-27
    • 1970-01-01
    • 2011-02-10
    相关资源
    最近更新 更多