Question

我需要实现一个生成输入框，并且在生成时有一个默认值，默认值应该自动聚焦并且应该选择所有文本;

这是我在JS中的功能，假设按钮已被点击并调用此函数

function createFolder()
{
   var newTextBoxDiv = $(document.createElement('div')).attr({   
                        "id" : 'TextBoxDiv',
                        "class" : 'TextBoxDiv+ctr'
                        });   
   newTextBoxDiv.html('<input type="text" name="folder_name" id="folder_name"   value="New Folder"/>');

   $("#folder_name").focus(function() { $(this).select(); } );

   newTextBoxDiv.appendTo("#fileTreeView");

}

Answer 1

当元素尚未附加到文档时，

$("#folder_name")将返回空。

试试这个：

function createFolder() {
    var newTextBoxDiv = $('<div id="TextBoxDiv"/>').addClass("TextBoxDiv+ctr");
    var input = $('<input type="text" name="folder_name" id="folder_name"  value="New Folder"/>').focus(function () {
        $(this).select();
    });
    newTextBoxDiv.append(input).appendTo("#fileTreeView");
}

我认为该函数将被多次调用，然后您需要为这些元素创建唯一的ID。

Answer 2

在某处设置计数器以跟踪新ID并将值插入新添加的元素定义中。并在附加事件之前附加元素。在函数中交换最后两行代码。

var folderCount = 0;

function createFolder() {

    var newTextBoxDiv = $(document.createElement('div')).attr({
        "id": 'TextBoxDiv_' + folderCount ,
        "class": 'TextBoxDiv+ctr'
    });
    newTextBoxDiv.html('<input type="text" name="folder_name_' + folderCount + '" id="folder_name_' + folderCount + '" value="New Folder"/>');
    newTextBoxDiv.appendTo("#fileTreeView");

    $("#folder_name_" + folderCount).focus().select();

    folderCount++;
}

在输入框的附加后，对焦并选择所有输入框

2 个答案: