如何使用PHP变量显示JavaScript警报?

时间:2017-09-23 12:10:02

标签: javascript php html

我试图用我的变量从php调出javascript警报。到目前为止,我的upload.php文件是:

<?php
if(isset($_POST['btn-upload']))
{
    $pic = rand(1000,100000)."-".$_FILES['pic']['name'];
    $pic_loc = $_FILES['pic']['tmp_name'];
    $folder="uploaded_files/";
    if(move_uploaded_file($pic_loc,$folder.$pic))
    {
        ?><script>alert('File successfully uploaded.\n![File Upload]('+window.location.href+')');
</script><?php
    }
    else
    {
        ?><script>alert('Sorry, error while uploading file. Please try again');</script><?php
    }
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Photo Uploader for use in markdown</title>
</head>
<body>
<h2>Photo Uploader & Markdown generator</h2>
<p>Click 'Choose file' to choose the file to be uploaded. The filename should appear. Then click 'upload'. <br>A popup should show you what to copy and paste.</p>
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="pic" />
<button type="submit" name="btn-upload">upload</button>
</form>
</body>
</html>

然后我的html代码看起来像(只包括相关部分):

<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="pic" />
<button type="submit" name="btn-upload">upload</button>

此脚本的目的是将图片上传到服务器,然后显示缩减代码以供用户使用该图像。如果文件正确上传,我的目标是输出以下内容: ![Alternative Text](http://www.example.com/folder/photo.jpg)

我尝试了以下内容:

<?php
if(isset($_POST['btn-upload']))
{
    $pic = rand(1000,100000)."-".$_FILES['pic']['name'];
    $pic_loc = $_FILES['pic']['tmp_name'];
    $folder="uploaded_files/";
    if(move_uploaded_file($pic_loc,$folder.$pic))
    {
        ?><script>alert('File successfully uploaded.\n![File Upload]('+window.location.href+.$folder.'/'.$pic.')');</script><?php
    }
    else
    {
        ?><script>alert('Sorry, error while uploading file. Please try again');</script><?php
    }
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Photo Uploader for use in markdown</title>
</head>
<body>
<h2>Photo Uploader & Markdown generator</h2>
<p>Click 'Choose file' to choose the file to be uploaded. The filename should appear. Then click 'upload'. <br>A popup should show you what to copy and paste.</p>
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="pic" />
<button type="submit" name="btn-upload">upload</button>
</form>
</body>
</html>

这会生成一个上传文件但不显示js警报的工作网页。 我也尝试了以下内容:

<?php
if(isset($_POST['btn-upload']))
{
    $pic = rand(1000,100000)."-".$_FILES['pic']['name'];
    $pic_loc = $_FILES['pic']['tmp_name'];
    $folder="uploaded_files/";
    <script>var folder = "<?php echo $folder ?>";</script>
    <script>var pic = "<?php echo $pic ?>";</script>
    if(move_uploaded_file($pic_loc,$folder.$pic))
    {
        ?><script>alert('File successfully uploaded.\n![File Upload]('+window.location.href+folder+'/'+pic+')');</script><?php
    }
    else
    {
        ?><script>alert('Sorry, error while uploading file. Please try again');</script><?php
    }
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Photo Uploader for use in markdown</title>
</head>
<body>
<h2>Photo Uploader & Markdown generator</h2>
<p>Click 'Choose file' to choose the file to be uploaded. The filename should appear. Then click 'upload'. <br>A popup should show you what to copy and paste.</p>
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="pic" />
<button type="submit" name="btn-upload">upload</button>
</form>
</body>
</html>

这导致http错误500

有什么建议吗?

非常感谢,

3 个答案:

答案 0 :(得分:0)

您可以在php中创建一个函数,并在需要调用警报的地方调用它。

功能:

function alertMsg($str) {
    print("<script>alert('$str')</script>");
}

并在php中调用

//string
alertMsg("Success");

//php variable
$alertMsg = "Some alert message";
alertMsg($alertMsg);

//even you can concatenate both
alertMsg("This is an alert. ".$alertMsg);

希望这会有所帮助。 感谢。

答案 1 :(得分:0)

在这两次尝试中,您都试图将PHP,HTML和JavaScript混合起来,就好像它们都是相同的语言一样。他们不是。从其中任何一个的角度来看,另一个中的代码只不过是一个字符串。他们不能直接分享变量和逻辑。

了解这一行:

alert('File successfully uploaded.\n![File Upload]('+window.location.href+.$folder.'/'.$pic.')');

正在尝试直接在JavaScript中使用PHP代码(变量语法)。这只会导致JavaScript中出现语法错误,浏览器的开发控制台会向您指出这些错误。相反,将PHP代码括在<?php ?>标记中并回显结果:

alert('File successfully uploaded.\n![File Upload]('+window.location.href+'<?php echo $folder.'/'.$pic ?>'+')');

第二次尝试存在同样的问题,您将HTML / JavaScript直接放在PHP中:

$folder="uploaded_files/";
<script>var folder = "<?php echo $folder ?>";</script>

这导致PHP语法错误,PHP日志会告诉您(以及您正在获取的500内部服务器错误)。

PHP代码需要位于<?php ?>标记中。总是。所以这就像是:

$folder="uploaded_files/";
?>
<script>var folder = "<?php echo $folder ?>";</script>
<script>var pic = "<?php echo $pic ?>";</script>
<?php
if(move_uploaded_file($pic_loc,$folder.$pic))

另请注意,在HTML / JavaScript中,您不需要{em>每行 JavaScript代码的<script>标记。您可以在一个<script>元素中包含多行代码。

答案 2 :(得分:0)

在JS中使用变量PHP

<?php

  if (isset($_POST['btn-upload'])) {

    $pic     = rand(1000,100000)."-".$_FILES['pic']['name'];
    $pic_loc = $_FILES['pic']['tmp_name'];
    $folder  = "uploaded_files";

    if (move_uploaded_file($pic_loc, $folder . '/' . $pic)) { ?> 

      <script>
        alert("File successfully uploaded! " + 
              "\n" + 
              location.hostname + 
              "<?php echo '/' . $folder . '/' . $pic; ?>");
      </script>

<?php

    } else { ?>

      <script>alert("Sorry, error while uploading file. Please try again");</script>

<?php

    }

  }

?>

location.hostname = $ _SERVER [&#39; HTTP_HOST&#39;] // localhost