javascript - 完全复制到第二页的代码不起作用

Question

有人告诉我将一些现有功能复制到另一个页面（带有星号的评级系统，您可以将鼠标悬停在它们上以提高或降低评级；星号会根据评级填充，其余只是轮廓），但是没有出现在第二页上的星星。

我确保我正确地复制了对 CSS 和 JavaScript 文件的调用。当我硬编码星星出现时，它们确实出现了，但鼠标悬停只是突出显示鼠标所在的星，而不是从第一颗星直到鼠标悬停的所有星。原始页面没有对星星进行硬编码，所以我不知道为什么它在一个页面中有效，而在另一个页面中无效。

在原始页面中，在页面顶部调用 CSS：

@import "<?php echo base_url(); ?>css/rating.min.css";

代码在此处插入页面：

echo '<div style="height: 24px; padding: 5px;"><label>Transcript Quality:</label><span id="qualitystars" style="vertical-align: sub;"></span></div>';
echo '<input type="hidden" name="quality" id="quality"' . (isset($transcriber['quality']) ? ' value="' . $transcriber['quality'] . '"' : '') . '>';

JavaScript在这里被调用：

<script type="text/javascript" src="<?php echo base_url(); ?>js/rating.min.js"></script>

在新页面中，我调用 CSS：

@import "<?php echo base_url(); ?>css/rating.min.css";

然后我将代码插入页面：

echo 'Please rate the quality of this transcript:<br/>';
echo '<div style="height: 44px; padding: 5px;">';
echo '<span id="qualitystars" style="vertical-align: sub;"></span>';
echo '</div>

我将这些元素复制到新页面中，但第二页 ( id="qualitystars") 中没有显示任何内容。我唯一能想到的是，这是在 TINY.box 中调用的，但为什么会有所不同呢？任何帮助将不胜感激。

标签： javascriptphpcss