Uncaught TypeError: Не удается прочитать свойство 'selectionStart' из null

Question

У меня есть готовый javascript, который взаимодействует с формой для консервированных ответов из моей базы данных. Когда не нажав кнопку вставки ничего не случается, хотя и хром показывает ошибку: неперехваченным TypeError: Не удается прочитать свойство «SelectionStart» нулевых

Вот JavaScript/PHP/HTML:

<tr><?php echo tep_draw_form('status', FILENAME_ORDERS, tep_get_all_get_params(array('action')) . 'action=update_order'); ?> 
     <td class="main"> 
      <script language="javascript"> 
        function insereTexto(){ 
        //Paste into textarea 
        var textarea = document.getElementById("txt"); 

        //Text to be inserted 
        var texto = document.getElementById("txtValor").value; 

        //beginning of the selection 
        var sel_start = textarea.selectionStart;    

        //end of the selection 
        var sel_end = textarea.selectionEnd; 


        if (!isNaN(textarea.selectionStart)) 
        //Treatment for Mozilla 
        { 
         var sel_start = textarea.selectionStart; 
         var sel_end = textarea.selectionEnd; 

         mozWrap(textarea, texto, '') 
         textarea.selectionStart = sel_start + texto.length; 
         textarea.selectionEnd = sel_end + texto.length; 
        }  

        else if (textarea.createTextRange && textarea.caretPos) 
        { 
         if (baseHeight != textarea.caretPos.boundingHeight) 
         { 
          textarea.focus(); 
          storeCaret(textarea); 
         }   
         var caret_pos = textarea.caretPos; 
         caret_pos.text = caret_pos.texto.charAt(caret_pos.texto.length - 1) == ' ' ? caret_pos.text + text + ' ' : caret_pos.text + text; 

        } 
        else //For those who can not enter, insert at the end of it (ie. ..) 
        { 
         textarea.value = textarea.value + texto; 
        }   
        } 

        /* 
        This function opens the text of two strings and inserts the text at the cursor position well after he joins novamento text but the text entered 
This wonderful feature only works in Mozilla ... IE does not have the properties SelectionStart, textLength ... 
        */ 
        function mozWrap(txtarea, open, close) 
        { 
        var selLength = txtarea.textLength; 
        var selStart = txtarea.selectionStart; 
        var selEnd = txtarea.selectionEnd; 
        var scrollTop = txtarea.scrollTop; 

        if (selEnd == 1 || selEnd == 2) 
        { 
         selEnd = selLength; 
        } 
        //S1 has the text from the beginning to the cursor position 
        var s1 = (txtarea.value).substring(0,selStart); 

        //S2 has the selected text 
        var s2 = (txtarea.value).substring(selStart, selEnd) 

        //S3 has all the selected text 
        var s3 = (txtarea.value).substring(selEnd, selLength); 

        //Places the text in the textarea. Uses the string that was in the beginning, in the middle of the input string, then the selection string then the 
        //closing and finally what's left after the selection 
        txtarea.value = s1 + open + s2 + close + s3;   
        txtarea.selectionStart = selEnd + open.length + close.length; 
        txtarea.selectionEnd = txtarea.selectionStart; 
        txtarea.focus(); 
        txtarea.scrollTop = scrollTop; 
        return; 
        } 
        /* 
        Insert at Caret position. Code from 
        [url]http://www.faqts.com/knowledge_base/view.phtml/aid/1052/fid/130[/url] 
        */ 
        function storeCaret(textEl) 
        { 
         if (textEl.createTextRange) 
         { 
          textEl.caretPos = document.selection.createRange().duplicate(); 
         } 
        } 

       </script> 

           <select id="txtValor" /> 
           <option value="">Select Text</option> 
           <option value="<?php echo $order->customer['name']; ?>">Customer Name</option> 
           <option value="<?php echo STORE_NAME_ADDRESS; ?>">signature</option> 
           <option value="<?php echo STORE_NAME; ?>">Store Name</option> 
           <option value="<?php echo $_SERVER['SERVER_NAME']; ?>">Site</option> 
           <option value="<?php echo STORE_OWNER; ?>">Store Owner</option> 
           <option value="<?php echo STORE_OWNER_EMAIL_ADDRESS; ?>">Email the Store</option> 
           <?php 
           $get_premades_query = tep_db_query("select * from orders_premade_comments order by id"); 
           while($result = mysql_fetch_array($get_premades_query)) { 
           echo '<option value="'.$result["text"].'">'. $result["title"].'</option>'; 
           } 
           ?> 
           </select> 
           <input type="button" value="Insert at the cursor position" onclick="insereTexto()"/> 
           <input type="button" value="Clean" onclick="this.form.elements['comments'].value=''"> 
            <font class="smallText"><a href="premade_comments.php">[Setup]</a></font><br> 


     <?php echo tep_draw_textarea_field('comments', 'soft', '80', '10','','id="txt"'); ?></td> 
     </tr> 

Я действительно не» t знаю много javascript, php вызывает правильные поля базы данных, и я могу правильно их отследить. Но я предполагаю, что функция selectStart используется неправильно?

Answer 1

В сообщении говорится:

Cannot read property 'selectionStart' of null 

, который является правильным: null не имеет свойств, поэтому он не может иметь selectionStart.

Итак, откуда это взялось null? .selectionStart запрашивается textarea:

    //beginning of the selection 
       var sel_start = textarea.selectionStart;    

и textarea происходит от DOM:

//Paste into textarea 
    var textarea = document.getElementById("txt"); 

Так, видимо, getElementById() вызов возвращается null вместо чего-то.

Вы должны проверить HTML для проверки там is текстовое поле с идентификатором txt. Вы можете также добавить явные проверки в случае, если это случается только с перерывами:

//Paste into textarea 
    var textarea = document.getElementById("txt"); 
    if (!textarea) 
     alert("Och! No txt textarea defined?"); 

... когда это произойдет, проверьте источник HTML, чтобы проверить, почему это произошло. Может быть, вы не всегда показываете текстовое поле, может быть, изменения ID и т.д.

Answer 2

вот ваша проблема

var textarea = document.getElementById("txt"); 

не определен в документе

• еще одно предупреждения: использование не поддерживается HTML тег

  <font class="smallText"><a href="premade_comments.php">[Setup]</a></font>

  <font> тег не поддерживается в HTML 5 и амортизируется в HTML 4.01

• Вот подсказка: использовать PHP короткие руки эхо обозначения для читаемости кода.

  это <?php echo STORE_NAME_ADDRESS; ?>

  такая же, как <?=STORE_NAME_ADDRESS ?> и выглядит намного лучше, когда ваш делать несколько операторов эхо