Fatal编程技术网
  • javascript/
  • Javascript代码从内联文件移动到外部文件时会产生错误

Javascript代码从内联文件移动到外部文件时会产生错误

javascript php jquery

Javascript代码从内联文件移动到外部文件时会产生错误,javascript,php,jquery,Javascript,Php,Jquery,我在正在处理的页面中内置了一个复制脚本，当copy JS是内联的时，它工作得很好，但一旦我将其移到外部，它就会产生以下错误： copy.js:1未捕获类型错误：无法读取null的属性“addEventListener” 我不确定为什么，因为内联没有问题。章节代码的副本为： <?php $connect = mysqli_connect("localhost", "brandina_templat", "REMOVED", "brandina_templates"); $catr

我在正在处理的页面中内置了一个复制脚本，当copy JS是内联的时，它工作得很好，但一旦我将其移到外部，它就会产生以下错误： 
copy.js:1未捕获类型错误：无法读取null的属性“addEventListener”

我不确定为什么，因为内联没有问题。章节代码的副本为：

    <?php
$connect = mysqli_connect("localhost", "brandina_templat", "REMOVED", "brandina_templates");  
$catresult = "SELECT * FROM categories";
$catquery = mysqli_query($connect,$catresult);
$catquery2 = mysqli_query($connect,$catresult);
?>
<html>  
      <head>  
           <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
           <title>Templates Sheet | Brandin Arsenault's</title>    
           <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
           <script src="js/bootstrap.js"></script>  
           <script src="js/tabcontent.js"></script> 
           <link href="css/bootstrap.css" rel="stylesheet" />  
      </head>   
      <body>  
       <div class="container">  
                <br />  
                <h1 align="center">Templates Sheet</h1>
                    <center><ul class="tabs">
<?php
    if(!$catquery)
    {
        die('Invalid query: ' . mysql_error());
    }
        while($row = mysqli_fetch_array($catquery))
        {
            $number=$row['number'];
            $tabname=$row['tabname'];
            $catname=$row['catname'];
            echo "<li class='tab-link' data-tab='$tabname'>$catname</li>";
        }
?>
        </ul>
<?php
    if(!$catquery2)
    {
        die('Invalid query: ' . mysql_error());
    }
        while($row = mysqli_fetch_array($catquery2))
        {
            $number=$row['number'];
            $tabname=$row['tabname'];
            $catname=$row['catname'];
            $result = "SELECT * FROM templates WHERE category=$number";
            $query = mysqli_query($connect,$result);
            echo "<div id='$tabname' class='tab-content'>
                                        <table><center>";
                    $c = 0;
                    $n = 3;
                if(!$query)
                    {
                        die('Invalid query: ' . mysql_error());
                    }
                        while($row = mysqli_fetch_array($query))
                            {
                                $id=$row['id'];
                                $longname=$row['longname'];
                                $shortname=$row['shortname'];
                                $text=$row['text'];
                                    if($c % $n == 0 && $c != 0)
                                        {
                                            echo '</tr><tr>';
                                        }
                                    $c++;
                                    echo "
                                        <td>
                        <center><b>$longname</b></center><textarea id='$id' cols='25' rows='3'>$text</textarea><br /><button id='$shortname'>Copy</button>
                                        </td>
                                        <script>
                                            var shortname = '$shortname';
                                        </script>";
                            }
            echo "</center></table></div>";
        }
?>
<script src='js/copy.js'></script>
</center>
</div>
</body>
</html>
提前谢谢

当您使用内联代码时，变量
$shortname
存在，但当您将代码移动到外部时，它不再存在

您可以使用：

<script>
    var shortname = '$shortname';
</script>
<script src='js/copy.js'></script>
否则-javascript代码正在查找其id为
$shortname
的元素，而您实际上没有一个具有该值的元素。

您的PHP解释器是否在本地所有文件上运行？可能删除id
$shortname
的美元符号？@BrandinArsenault，更新了我的答案，您可以查看。谢谢您的回复。JS继续产生错误，就像我原来的帖子一样。我不知道为什么。我使用了你的步骤，完全理解你的意思，但遗憾的是，这并不能解决问题。如何打印变量？2.你看起来像什么。您实际上不想在循环内设置
。2.
getElementById
中的
shortname
应该没有引号（这是变量的名称，而不是字符串），非常感谢您的帮助。我已经将定义
var
的脚本移到了循环的内部和外部。在循环内部，不会产生任何错误，但使用“复制”按钮时不会发生任何功能。在循环之外，它会产生原始错误。我已经对
getElementById
函数进行了建议的更改，这正在发生。我感谢你在这方面的帮助。如果不看完整的代码，在更改之后，很难提供帮助。请注意，您可能不想使用
id
而想使用其他选择器（比如类，它不是唯一的）。 
<script>
    var shortname = '$shortname';
</script>
<script src='js/copy.js'></script>

document.getElementById(shortname).addEventListener('click', function() {