Question

我不知道为什么会这样，但是使用非常相似的代码来尝试将两个不同的<textarea>元素集中在一个元素上。

在我的页面上，我有一个文本区域，用户可以在其中键入答复，但是用户也可以通过将文本区域（使用AJAX加载到页面上）来编辑其答复；加载此“编辑”文本区域焦点后，我已经成功完成了工作。

但是，两个文本区域都有与之相关的格式设置按钮（粗体，斜体等），我希望这些按钮在单击时能将适当的文本区域聚焦。

问题在于，即使两个输入区域的HTML相同（当然，ID除外），这也仅适用于普通文本区域，而不适用于AJAX加载的文本区域。

为什么会这样？这是我的网站上关注焦点的唯一问题。

//Loads in the edit textarea with AJAX
function editComment()
{
    var edited = false;

    $("#content").on("click", ".edit-button", function(event){

        event.preventDefault();

        var commentID = this.id.match(/\d+/);            
        var container = "#comment-" + commentID;

        if (!edited)
        {     
            $(container).data("old-state", $(container).html());
            $(container).load("/php/_edit.area.php", {

                id: commentID

            }, function(){$("#edit-text-area").focus();}); //this works

            edited = true;
        }

        else if (edited)
        {       
            edited = false;
            $(container).html($(container).data("old-state"));
        }
    }); 
}

//Inserts formatting on the default textarea
function handleFormatting()
{
    $('#format-button').on("click", function(event) 
    {
        event.preventDefault();
        //do formatting 
        $("#default-text-area").focus(); //this works      
    });

//Inserts formatting on the edit/AJAX textarea
function handleEditFormatting()
{
    $('#edit-format-button').on("click", function(event) 
    {
        event.preventDefault();
        //do formatting 
        $("#edit-text-area").focus(); //this does not work        
    });

$(document).ready(function(){

    editComment();
    handleFormatting();
    handleEditFormatting();

});

[EDIT]澄清一下，虽然我可以将编辑textarea的焦点加载到其中，但我希望用户能够单击该文本区域（也许可以在页面上移动不论出于何种原因），然后在按下按钮后再次赋予焦点。

为什么我不能使用AJAX中加载的按钮来集中文本区域？

0 个答案: