Javascript 将onclick添加到禁用的输入框

Javascript 将onclick添加到禁用的输入框,javascript,jquery,onclick,inputbox,Javascript,Jquery,Onclick,Inputbox,我有一个表,其中有复选框,一些复选框被禁用。我想使用JavaScript或jQuery向所有禁用的复选框添加onclick属性 HTML 但它不起作用,而且我想知道如何处理不同的docname,因为在onclick语句中,name=docname对于每个输入框都是不同的 我是用电脑做的 禁用的元素不会生成鼠标事件。所以基本上我所做的就是在禁用的输入周围添加一个div,并添加一些JS来匹配它 我是用电脑做的 禁用的元素不会生成鼠标事件。所以基本上我所做的就是在禁用的输入周围添加一个div,并添加一

我有一个表,其中有复选框,一些复选框被禁用。我想使用JavaScript或jQuery向所有禁用的复选框添加onclick属性

HTML

但它不起作用,而且我想知道如何处理不同的docname,因为在onclick语句中,name=docname对于每个输入框都是不同的

我是用电脑做的

禁用的元素不会生成鼠标事件。所以基本上我所做的就是在禁用的输入周围添加一个div,并添加一些JS来匹配它

我是用电脑做的

禁用的元素不会生成鼠标事件。所以基本上我所做的就是在禁用的输入周围添加一个div,并添加一些JS来匹配它


如果您无法更改现有的HTML结构,并且希望在单击最近的元素时执行操作,请使用以下代码

Javascript jQuery


如果您无法更改现有的HTML结构,并且希望在单击最近的元素时执行操作,请使用以下代码

Javascript jQuery



禁用的输入不会注册许多/所有事件onclick可能会添加到最近的或。当然,您的代码不会工作-您没有正确引用属性值。如果可以正确地将事件绑定到,则不应使用jQuery设置onclick属性。on@ChankeyPathak我们可以将其添加到最近的td,但这不会给人与单击复选框相同的感觉,对吗?不管怎样,你可以看看这个最近的点击。请记住只在复选框外单击。@Harry,这就违背了单击复选框的目的…禁用的输入不会注册许多/所有事件。单击一次可能会添加到最近的或。当然,您的代码将无法工作-您没有正确引用属性值。如果可以正确地将事件绑定到,则不应使用jQuery设置onclick属性。on@ChankeyPathak我们可以将其添加到最近的td,但这不会给人与单击复选框相同的感觉,对吗?不管怎样,你可以看看这个最近的点击。请记住在复选框外单击。@这违背了单击复选框的目的……这是处理禁用的InputsHanks上的鼠标事件的唯一真实方法,但我希望第一个和第三个复选框在onclick上的name=docname是不同的。对于第1个,它将是name=docname,但是对于第3个,它将是name=docname3。@ChankeyPathak OK,修改了代码以根据最后一个/后面的value属性中的字符串来执行。谢谢@Pietu1998。但是我不能修改我的HTML来添加div。那么这个div可以只使用jQuery添加到禁用的复选框中吗?我正在尝试这样做,但我必须去学校。这是给我的TypeError:这个.\u容器未定义。如果有人需要,他们可以修复它:这是处理禁用InputsHanks上的鼠标事件的唯一真实方法,但我希望第一个和第三个复选框的onclick上的name=docname是不同的。对于第1个,它将是name=docname,但是对于第3个,它将是name=docname3。@ChankeyPathak OK,修改了代码以根据最后一个/后面的value属性中的字符串来执行。谢谢@Pietu1998。但是我不能修改我的HTML来添加div。那么这个div可以只使用jQuery添加到禁用的复选框中吗?我正在尝试这样做,但我必须去学校。这是给我的TypeError:这个.\u容器未定义。如果有人需要,他们可以修复它:
<table class="docs_table" id="myTable2">
<tr id="node-22" class="disabled_element">
<td title="Document can't be selected.">
    <input type="checkbox" name="docs" id="/root/docname" value="/root/docname" disabled />
</td>
</tr>
<tr id="node-23" class="">
<td title="">
    <input type="checkbox" name="docs" id="/root/docname2" value="/root/docname2" />
</td>
</tr>
<tr id="node-24" class="disabled_element">
<td title="Document can't be selected.">    
    <input type="checkbox" name="docs" id="/root/docname3" value="/root/docname3" disabled />
</td>
</tr>
</table>
 $('table tr td input[type="checkbox"]').each(function () {
    if ($( this ).prop('disabled')) {
        $( this ).closest('tr').addClass('lineThrough');
        $( this ).attr('onClick','onclick="javascript:if(confirm('Press OK to confirm')){ document.location='/pathtoscript?command=dosomething&amp;name=docname'};return false;"');
    }
});
<table class="docs_table" id="myTable2">
    <tr id="node-22" class="disabled_element">
        <td title="Document is being edited by someone.">
            <div style="display:inline-block; position:relative;">
                <input type="checkbox" name="docs" id="/root/docname" value="/root/docname" disabled />
                <div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
            </div>
        </td>
    </tr>
    <tr id="node-23" class="child">
        <td title="">
            <input type="checkbox" name="docs" id="/root/docname2" value="/root/docname2" />
        </td>
    </tr>
    <tr id="node-22" class="disabled_element">
        <td title="Document is being edited by someone.">
            <div style="display:inline-block; position:relative;">
            <input type="checkbox" name="docs" id="/root/docname3" value="/root/docname3" disabled />
                <div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
            </div>
        </td>
 $('table tr td input[type="checkbox"] + div').each(function () {
     if ($(this).prev('input[disabled]')) {
         $(this).closest('tr').addClass('lineThrough');
         $(this).click(function () {
             if (confirm('Press OK to confirm')) {
                 var docname = $(this).prev('input[disabled]').prop('value');
                 docname = docname.substring(docname.lastIndexOf('/') + 1);
                 document.location = '/pathtoscript?command=dosomething&amp;name=' + docname;
             }
         });
     }
 });
$(document).ready(function(){
$('table tr td input[type="checkbox"]').each(function () {
    if ($( this ).prop('disabled')) {
        $( this ).closest('tr').addClass('lineThrough');
        var valStr = $(this).val();
        $( this ).closest('td').attr('onClick', 'clickFn("'+valStr+'");');
        //console.log($( this ).closest('td').attr('onClick'));
    }});
});

function clickFn(valStr){ 
    if(confirm('Press OK to confirm')){ 
        valStr = valStr.substring(valStr.lastIndexOf('/') + 1);
        newHref = '/pathtoscript?command=dosomething&amp;name=' +valStr;
        //console.log(newHref);
        document.location = newHref;
    }
}