php echo在firefox中显示substr
我在 php 页面上有一些代码，它获取图像文件名，删除扩展名并删除前两个字符，然后将字符串添加到 echo 语句中。我的问题是加载幻灯片时会显示该字符串。有什么办法可以做得更好。这仅发生在所有其他浏览器中的 Firefox 中，此处未显示字符串
<?php
try {
// Styling for images
echo "<div id=\"myslides\">";
$files = new DirectoryIterator($imageFolder);
$i=0;
$files_array = array();
foreach ($files as $fileinfo){
if ($fileinfo->isFile()){
$files_array[$i++]=$fileinfo->getFileName();
}
}
asort($files_array);
foreach ( $files_array as $file ) {
$path = $imageFolder . "/" . $file;
$fileBaseName=basename($path,".jpg");
$trimmed=substr($fileBaseName,2);
echo "<img src=\"" . $path . "\" alt=\"" . $trimmed . "\" />";
}
echo "</div>";
}
catch(Exception $e) {
echo 'No images found for this slideshow.<br />';
}
?>
是完整代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Michael Horsfall" />
<title>Exposure Slideshow</title>
<link rel="stylesheet" href="modules/mod_exposure_slideshow/css/style.css" type="text/css" media="screen" />
<script src="modules/mod_exposure_slideshow/js/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="modules/mod_exposure_slideshow/js/jquery.cycle.all.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myslides').cycle({
fx: '<?php echo $effectFx; ?>',
speed: <?php echo $speed; ?>,
timeout: 0,
nowrap: 1,
fit: 1,
pause: 2,
pager: '#navi'
});
$('#nav .next a').click(function(){
var nextClick = $('#navi a.activeSlide').next('a');
$(nextClick).click();
return false;
})
// back arrow
$('#nav .prev a').click(function(){
var prevClick = $('#navi a.activeSlide').prev('a');
$(prevClick).click();
return false;
})
});
</script>
<script type="text/javascript">
//<![CDATA]
$(function(){
// nav animation2
$('#nav_move').css({
width: 16,
height: 16
});
$('#navi a').click(function() {
var offset = $(this).offset();
var offsetbody= $('#nav').offset();
//find the offset of the wrapping div
$('#nav_move').animate({
width: $(this).width()+7,
height: 16,
left: (offset.left-offsetbody.left-1.2)
});
return false;
});
});
//]]>
</script>
</head>
<body>
<div id="container">
<h1>
<?php
try {
// Styling for images
echo "<div id=\"myslides\">";
$files = new DirectoryIterator($imageFolder);
$i=0;
$files_array = array();
foreach ($files as $fileinfo){
if ($fileinfo->isFile()){
$files_array[$i++]=$fileinfo->getFileName();
}
}
asort($files_array);
foreach ( $files_array as $file ) {
$path = $imageFolder . "/" . $file;
$fileBaseName=basename($path,".jpg");
$trimmed=substr($fileBaseName,2);
echo "<img src=\"" . $path . "\" alt=\"" . $trimmed . "\" />";
}
echo "</div>";
}
catch(Exception $e) {
echo 'No images found for this slideshow.<br />';
}
?>
</h1>
</div>
<div id="nav" class="nav">
<span id="nav_move"></span>
<div id="navi" class="navi">
</div>
<div id="next" class="next">
<a id="next" href="#"></a>
</div>
<div id="prev" class="prev">
<a id="prev" href="#"></a>
</div>
</div>
</body>
</html>
I have some code on a php page that gets an image filename strips the extension and removes the first two characters and then adds the string to an echo statement. My problem is that this string is being displayed when a slideshow is loading. Is there any way to do this Better. This only occurs in firefox in all other browsers the string isnt displayed
<?php
try {
// Styling for images
echo "<div id=\"myslides\">";
$files = new DirectoryIterator($imageFolder);
$i=0;
$files_array = array();
foreach ($files as $fileinfo){
if ($fileinfo->isFile()){
$files_array[$i++]=$fileinfo->getFileName();
}
}
asort($files_array);
foreach ( $files_array as $file ) {
$path = $imageFolder . "/" . $file;
$fileBaseName=basename($path,".jpg");
$trimmed=substr($fileBaseName,2);
echo "<img src=\"" . $path . "\" alt=\"" . $trimmed . "\" />";
}
echo "</div>";
}
catch(Exception $e) {
echo 'No images found for this slideshow.<br />';
}
?>
here is the full code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="Michael Horsfall" />
<title>Exposure Slideshow</title>
<link rel="stylesheet" href="modules/mod_exposure_slideshow/css/style.css" type="text/css" media="screen" />
<script src="modules/mod_exposure_slideshow/js/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="modules/mod_exposure_slideshow/js/jquery.cycle.all.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myslides').cycle({
fx: '<?php echo $effectFx; ?>',
speed: <?php echo $speed; ?>,
timeout: 0,
nowrap: 1,
fit: 1,
pause: 2,
pager: '#navi'
});
$('#nav .next a').click(function(){
var nextClick = $('#navi a.activeSlide').next('a');
$(nextClick).click();
return false;
})
// back arrow
$('#nav .prev a').click(function(){
var prevClick = $('#navi a.activeSlide').prev('a');
$(prevClick).click();
return false;
})
});
</script>
<script type="text/javascript">
//<![CDATA]
$(function(){
// nav animation2
$('#nav_move').css({
width: 16,
height: 16
});
$('#navi a').click(function() {
var offset = $(this).offset();
var offsetbody= $('#nav').offset();
//find the offset of the wrapping div
$('#nav_move').animate({
width: $(this).width()+7,
height: 16,
left: (offset.left-offsetbody.left-1.2)
});
return false;
});
});
//]]>
</script>
</head>
<body>
<div id="container">
<h1>
<?php
try {
// Styling for images
echo "<div id=\"myslides\">";
$files = new DirectoryIterator($imageFolder);
$i=0;
$files_array = array();
foreach ($files as $fileinfo){
if ($fileinfo->isFile()){
$files_array[$i++]=$fileinfo->getFileName();
}
}
asort($files_array);
foreach ( $files_array as $file ) {
$path = $imageFolder . "/" . $file;
$fileBaseName=basename($path,".jpg");
$trimmed=substr($fileBaseName,2);
echo "<img src=\"" . $path . "\" alt=\"" . $trimmed . "\" />";
}
echo "</div>";
}
catch(Exception $e) {
echo 'No images found for this slideshow.<br />';
}
?>
</h1>
</div>
<div id="nav" class="nav">
<span id="nav_move"></span>
<div id="navi" class="navi">
</div>
<div id="next" class="next">
<a id="next" href="#"></a>
</div>
<div id="prev" class="prev">
<a id="prev" href="#"></a>
</div>
</div>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
幻灯片是用 javascript 编写的吗，比如 jQuery 之类的？
我认为发生的情况是图像标签的替代文本可能在图像加载之前显示。由于某种原因，您是否需要 alt 属性具有值？您始终可以将其保留为空白字符串，例如 alt=""
如果这不起作用，或者您需要原样的 alt 文本，并且您的幻灯片是使用 jQuery 或类似的 javaScript，另一种选择是使用 css 隐藏幻灯片 div，并在幻灯片加载后回调显示 div。
这将使其隐藏，直到您在 JavaScript 中显示它。
如果幻灯片是在 jQuery 中，您只想在幻灯片加载后执行此操作（通过幻灯片库的回调知道它已完成加载）：
需要有关幻灯片实现/alt 标记要求的更多详细信息才能确定。
Is the slideshow in javascript, like in jQuery or something?
I think what is happening is the alt text of the image tag is being displayed before the image loads perhaps. Do you need the alt attribute to have a value for some reason? You could always leave it a blank string like alt=""
If that doesn't work, or you need the alt text as is and your slideshow is in javaScript using jQuery or similar, another option is to hide the slideshow div with css, and have a callback from after the slideshow is loaded show the div.
which will keep it hidden until you show it in javascript.
If the slideshow is in jQuery, you would just want to do this after the slideshow is loaded (through a callback of the slideshow library that knows it is done loading):
Need more details about your slideshow implementation / alt tag requirements to be sure.
我在 3 个浏览器（Chrome、Firefox、Opera）中测试了您的代码，所有浏览器都给出了相同的结果：
这是否不需要结果？
I tested your code in 3 browsers(Chrome, Firefox, Opera) and all ones give same result:
Is it not needed result?