无法在html中对输入文本使用焦点

Unable to use focus on input text in html

本文关键字:文本 焦点 输入 html      更新时间:2023-09-26

我正在尝试以下代码,但它不起作用。

 var option=$('<input type="text" value=""/>');
 $(this).append($(option));
 $(option).focus();

我还试着使用:

$(this).children().first().focus();

但这也不起作用。

以下是完整的功能:

var templatestring = "<tr><td class='itemId' style='display:none'></td><td id='tdelement' class='Correct'></td><td id='tdelement' class='Option'></td></td><td id='tdelement' class='Action'><input type='button' value='View' onclick='view(this)'/></td><td id='tdelement' class='Remove'><img src='" + STATIC_URL + "img/delete.jpg' width='20' height='20' align='center'></td></tr>";
var template = $(templatestring);
$("#addoption").button().click(function() {
        var newrow = $(template).clone();
        $(newrow).children().each(function() {
            switch($(this).attr('class')) {
                case 'itemId':
                    $(this).html('');
                    break;
                case 'Option':
                    var option=$('<input type="text" value=""/>');
                    $(this).append($(option));
                    $(this).find('input:text').val('11');
                    $(option).focus();
                    break;
                case 'Correct':
                    $(this).html('<input type="radio" class="Answer" name="correct"/>');
                    break;
                case 'Action':
                    $('input:button', this).val('Add');
                    break;
            }
        });
        $('#datatable tbody').append(newrow);
    });

如果它有任何帮助,我正在使用谷歌铬。

什么是$(this)?如果不在选择器功能中,则this将参考窗口。如果你想附加到主体,你可以这样做

var option=$('<input type="text" value=""/>');
$('body').append($(option)); // You can also use div , selector instead of body
$(option).focus();

TD演示

HTML

<table>
    <tr>
        <td>Add</td>
    </tr>
</table>

JS-

$('td').click(function() {
    var option = $('<input type="text" value=""/>');
    $(this).append($(option));
    $(option).focus();
});

在OP更新后,我可以理解为什么上述解决方案不适用于您。您需要在将input附加到table之后调用focus。试试这个:

var templatestring = "<tr><td class='itemId' style='display:none'></td><td id='tdelement' class='Correct'></td><td id='tdelement' class='Option'></td></td><td id='tdelement' class='Action'><input type='button' value='View' onclick='view(this)'/></td><td id='tdelement' class='Remove'><img src='" + STATIC_URL + "img/delete.jpg' width='20' height='20' align='center'></td></tr>";
var template = $(templatestring);
var option;
$("#addoption").button().click(function() {
    var newrow = $(template).clone();
    $(newrow).children().each(function() {
        switch ($(this).attr('class')) {
            case 'itemId':
                $(this).html('');
                break;
            case 'Option':
                option = $('<input type="text" value=""/>');
                $(this).append($(option));
                $(this).find('input:text').val('11');
                $(option).focus();
                break;
            case 'Correct':
                $(this).html('<input type="radio" class="Answer" name="correct"/>');
                break;
            case 'Action':
                $('input:button', this).val('Add');
                break;
        }
    });
    $('#datatable tbody').append(newrow);
    $(option).focus();
});