错误使用php和html javascript错误

问题描述：

我在使用php生成html时无法运行某些javascript时遇到问题。错误使用php和html javascript错误

这是我的文件。在这个页面上的JavaScript使所有跨度的使用jQuery的最大跨度的宽度，但它失败时，我尝试添加<li></li>元素，谁能告诉我为什么李指出下面导致脚本无法获得actaul最宽的宽度。

<html> 
<head> 
<style> 
.codesnippet { 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    border: thin solid black; 
    width: 740px; 

} 
.codesnippet .heading { 
    padding-left: 10px; 
    background-color: lightblue; 
    height: 25px; 
} 
.codesnippet .content { 
    background-color: white; 
    white-space: nowrap; 
    overflow: scroll; 

} 
.codesnippet .grey { 
    background-color: lightgrey; 
    margin: 0px; 
    display: inline-block; 
    min-width: 683px; 
} 
.codesnippet .white { 
    background-color: white; 
    margin: 0px; 
    display: inline-block; 
    min-width: 683px; 
} 
</style> 
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> 
<script> 
window.onload = function() { 
    var spanwidth = [] 
    l = 0; 
    var ollength = $('ol').length; 
    for (var i = 0; i < ollength; i++) { 
     $('ol').eq(i).children('li').each(function() { 
      spanwidth.push($(this).children('span').width()); 
      l++; 
     }); 
     makeThemEqual(i, spanwidth); 
     l = 0; 
    } 
} 
function makeThemEqual(i, spanwidth) { 
    var a = 0; 
    var widest = spanwidth[0]; 
    $('ol').eq(i).children('li').each(function() { 
     if (widest < spanwidth[a]) { 

      widest = spanwidth[a]; 
     } 
     a++; 
    }); 
    if (widest > 683) { 
     $('ol').eq(i).children('li').each(function() { 

      $(this).children('span').width(widest + "px"); 
     }); 
    } 
    widest = 0; 

} 
</script> 
</head> 
<body> 
<div class="codesnippet"> 
<div class="content"> 
<?php echo 
"<ol>". 
"<li><span class='grey'>".htmlspecialchars("<?php")."</span></li>". 
"<li><span class='white'>".htmlspecialchars("/*")."</span></li>". 
"<li><span class='grey'>".htmlspecialchars("Plugin Name: PlacePluginNameHere")."</span></li>". 
"<li><span class='white'>".htmlspecialchars("Plugin URI: PlaceWebsiteAddressHere")."</span></li>". 
"<li></li>". //<--------------------- THIS CAUSES IT TO FAIL if this li is removed the script runs fine. 
"</ol>"; 
?> 
</div> 
</div> 
<div class="codesnippet"> 
<div class="content"> 
<?php echo 
"<ol>". 
"<li><span class='grey'>".htmlspecialchars("<?php ?>")."</span></li>". 
"<li><span class='white'>".htmlspecialchars("<div class=\"wrap\">")."</span></li>". 
"<li><span class='grey'>&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<div>")."</span></li>". 
"<li><span class='white'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<form method=\"post\" action=\"options.php\">")."</span></li>". 
"<li><span class='grey'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<?php settings_fields('Template_Settings'); ?>")."</span></li>". 
"<li><span class='white'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<?php ")."$".htmlspecialchars("options = get_option('Template_Settings'); ?>")."</span></li>". 
"<li><span class='grey'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<label>Example Setting</label> <input type=\"text\" name=\"Template_Settings[ExampleSetting]\" value=\"<?php echo ")."$".htmlspecialchars("options['ExampleSetting']; ?>\"><br>")."</span></li>". 
"<li><span class='white'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("<label></label><input type=\"submit\" name=\"Submit\" value=\"<?php esc_attr_e('Save Changes'); ?>\">")."</span></li>". 
"<li><span class='grey'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("</form>")."</span></li>". 
"<li><span class='white'>&nbsp;&nbsp;&nbsp;&nbsp;".htmlspecialchars("</div>")."</span></li>". 
"<li><span class='grey'>".htmlspecialchars("</div>")."</span></li>". 
"</ol>"; 
?> 
</div> 
</div> 
</body> 
</html>

答

那是因为下面一行

... 
$(this).children('span').width(widest + "px"); 
..

特里从<li>和你的情况得到<span>标签你不必为去年<li><span>标签，所以尝试改变：

..<li></li> 
..

到

.. 
<li><span></span></li> 
..

跨度在那里仍然失败 – mainuse4r

错误使用php和html javascript错误

相关推荐