Question

当我单击按钮将bbcode插入textarea时控制台警告：＆＃34;未捕获的ReferenceError：myTextarea未定义＆＃34;。你能帮我解决这个问题吗？

我有一个代码：

$(function(){
function formatText(el,tagstart,tagend){
var selectedText=document.selection?document.selection.createRange().text:el.value.substring(el.selectionStart,el.selectionEnd);// IE:Moz
var newText='['+tagstart+']'+selectedText+'[/'+tagend+']';
if(document.selection){//IE
el.focus();
var st=getCaret(el)+tagstart.length+2;
document.selection.createRange().text=newText;
var range=el.createTextRange();
range.collapse(true);
range.moveStart('character', st);
range.moveEnd('character',selectedText.length);
range.select();
el.focus();
}
else{//Moz
var st=el.selectionStart+tagstart.length+2;
var end=el.selectionEnd+tagstart.length+2;


el.value=el.value.substring(0,el.selectionStart)+newText+el.value.substring(el.selectionEnd,el.value.length);
    el.focus();
    el.setSelectionRange(st,end)
    }
    }
function getCaret(el) { // IE mission is tricky :)
    el.focus(); 
    var r = document.selection.createRange(); 
    if (r == null) { 
      return 0; 
    } 
    var re = el.createTextRange(), 
    rc = re.duplicate(); 
    re.moveToBookmark(r.getBookmark()); 
    rc.setEndPoint('EndToStart', re); 

    var add_newlines = 0;
    for (var i=0; i<rc.text.length; i++) {
      if (rc.text.substr(i, 2) == '\r\n') {
        add_newlines += 2;
        i++;
      }
    }
return rc.text.length + add_newlines; 
}
$("elements").after('<form action="/post" method="post" name="myForm"><textarea placeholder="Comments..." name="myTextarea"></textarea><span class = "repbbcode" title = "Bold" value="b" style="font-weight:bold" >B</span></form>');
$(".repbbcode").on("click" , function(){
formatText(myTextarea,'b','b');
});
});

Answer 1

$(".repbbcode").on("click" , function(){
    formatText(myTextarea,'b','b');
               ^^^^^^^^^^
});

myTextarea未定义。没有

var myTextarea = ....

你的代码中的

。你需要像

这样的东西

$(".repbbcode").on("click" , function(){
   var myTextarea = $("[name='myTextarea']).get(0);
    formatText(myTextarea,'b','b');
});

Answer 2

在这行代码中：

formatText(myTextarea,'b','b');

您必须将DOM元素作为第一个参数传递。您不能只传递DOM元素的名称。最简单的方法是使用document.getElementById("myTextArea")，然后在元素中设置id="myTextArea"。

因此，您的textarea HTML将为<textarea id="myTextArea" ...>。

而且，您的代码将是：

var textareaElement = document.getElementById("myTextArea");
formatText(textareaElement,'b','b');

如果你想按名称获取DOM元素，你也可以这样做：

var textareaElement = document.getElementsByName("myTextArea")[0];
formatText(textareaElement,'b','b');

这里的不同之处在于，document.getElementsByName()会返回可能包含多个元素的列表，因此您必须使用[0]进入该列表，以便将列表中的第一项传递给您的函数。< / p>

有很多不同的方法可以做到这一点（使用名称，类，ID等）。通常，如果您尝试在页面中获取一个唯一元素，则应为其指定id并使用document.getElementById()或jQuery等效元素。

Answer 3

您需要添加var myTextarea = document.getElementsByName('myTextarea')[0];

$(".repbbcode").on("click" , function(){
       var myTextarea = document.getElementsByName('myTextarea')[0]; // added myTextarea
       formatText(myTextarea,'b','b');
});

jQuery中未捕获的ReferenceError

3 个答案: