我是php的初学者,我正在制作小项目,这将帮助我学习更多的PHP.在网络服务器上的任何方式我已经上传了这种格式的图片:
1.jpg
2.jpg
3.jpg
4.jpg
5.jpg
Run Code Online (Sandbox Code Playgroud)
等等....
在我的页面正文中我有:
<?php
$imageNumber = 1;
?>
<img src="'$imageNumber'.'.jpg'">
Run Code Online (Sandbox Code Playgroud)
为什么这段代码不起作用?另外我想创建一个函数,每次用户点击一个按钮时,$imageNumber得到的增量1
您只能在PHP标记内使用PHP变量.
<?php
$imageNumber = 1;
echo '<img src="'.$imageNumber.'.jpg'">';
?>
Run Code Online (Sandbox Code Playgroud)
要么
<?php
$imageNumber = 1;
?>
<img src="<?php echo $imageNumber ?>.jpg">
Run Code Online (Sandbox Code Playgroud)
对于该功能,请使用javascript.jQuery会最简单,但我也包含了一个原始版本:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
</head>
<body>
<img id="the_image" src="1.jpg">
<input type="button" id="the_button" value="change" />
<script type="text/javascript">
var maxNumImages = 5;
// for the function, use javascript. jQuery would be simplest:
jQuery(function($) {
$('#the_button').click(function() {
var num = ($('#the_image').attr('src').match(/(\d+).jpg$/)||[false])[1];
if( num !== false ) {
if( num == maxNumImages ) { num = 0; }
$('#the_image').attr('src', (++num)+'.jpg');
}
});
});
</script>
<img id="the_image2" src="1.jpg">
<input type="button" id="the_button2" value="change" />
<script>
// or in old fashioned (i.e. boring,sad,pathetic,vanilla) js:
var maxNumImages = 5;
var button = document.getElementById('the_button2');
button.onclick = function() {
var image = document.getElementById('the_image2');
console.log(image.src);
var num = (image.src.match(/(\d+).jpg$/)||[false])[1];
console.log(num);
if( num !== false ) {
if( num == maxNumImages ) { num = 0; }
image.src = (++num)+'.jpg';
}
}
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)