Question

我之前在这篇文章here中收到了答案和解决方案，因此（几乎）完成了我的学校任务。

然而，我现在发现了浏览器选择方面的另一个问题。

当我查看Safari中的overview.php时，它看起来像这样：

Link to Imgur

正如您在图像中看到的，每当我使用Safari进行输入时，它会在前五行中将所有信息显示为空白，但下一个（在底部）显示所有正确的信息。 / p>

当我使用谷歌浏览器时，我没有任何问题，你可以在这里看到： Link to Imgur

所以我的问题是，我的代码的哪一部分让Safari做空条目？

我的代码：

index.html - 我的标准HTML表单所在的页面。

<!DOCTYPE html>
<html lang="da">

<html>
  <head>

    <title>Mobiloversigten</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="stylesheet.css">

  </head>

<body>

    <form name="formular" id="formular" method="post" action="process.php" enctype="multipart/form-data" autocomplete="on">

        <fieldset>

            <legend>Enhedsoplysninger</legend>
            <div><label>Producent: <input type="text" name="manufactor" id="manufactor" required="required" size="30"></label></div>
            <div><label>Produktnavn: <input type="text" name="product" id="product" required="required" size="30"></label></div>
            <div><label>Farve: <input type="text" name="color" id="color" required="required" size="30"></label></div>
            <label>Hukommelse:
                <div>    
                    <select size="1" name="memory" id="memory">
                        <option>8GB</option>
                        <option>16GB</option>
                        <option>32GB</option>
                        <option>64GB</option>
                        <option>128GB</option>
                    </select>
                </div>
            </label>
            <div><label>Skærmstørrelse <input type="number" name="displaysize" id="displaysize" min="0" step="0.1" size="30"></label></div>   
            <div><label>Produktbillede: <input type="file" name="productphoto" id="productphoto" required="required" size="30"></label></div>

        </fieldset>

        <div><input type="submit" id="ok" value="Indsend"><input type="reset" id="nulstil" value="Nulstil"></div>

    </form>

</body>

</html>

process.php - 保存index.html中条目的页面。

<!DOCTYPE html>
<html lang="da">

<html>
<head>

  <title>Mobiloversigten</title>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="stylesheet.css">

</head>

<body>

<div class= "logo">

    <img src="Mobilsiden.png" alt="Mobilsiden Logo" style="width:20%;height:20%;">

</div>

    <div class="boks">

        <h1>Enheden er registreret</h1>

    <div class="linie"></div><br>

        <div class="centerbuttons">
            <a href="index.html" class="myButton">Tilføj ny enhed</a>
            <a href="overview.php" class="myButton">Vis enheder</a>
        </div>

<?php

$manufactor = $_POST['manufactor'];
$product = $_POST['product'];
$color = $_POST['color'];
$memory = $_POST['memory'];
$displaysize = $_POST['displaysize'];
$productphoto = $_FILES['productphoto']['name'];


if($_FILES){
        if(strlen($_FILES['productphoto']['type'])==9)
        $name=$product . ".".$rest = substr($_FILES['productphoto']['type'], -3);
        else
        $name=$product . ".".$rest = substr($_FILES['productphoto']['type'], -4);

        move_uploaded_file($_FILES['productphoto']['tmp_name'], $name);

        }

$user_data = "$manufactor, $product, $color, $memory, $displaysize, $name \r\n";
$mobile_data = "Producent: ,Produktnavn: ,Farve: ,Hukommelse: ,Skærmstørrelse: ";

$fh = fopen("data.txt", "a")   or die("Filen kunne ikke oprettes");
fwrite($fh, $user_data)         or die("Kunne ikke skrive til filen");
fclose($fh);

$fj = fopen("mobile.txt", "w")  or die("Filen kunne ikke oprettes");
fwrite($fj, $mobile_data)       or die("Kunne ikke skrive til filen");
fclose($fj);

?>

</div>

</body>

</html>

overview.php - 显示之前保存的文本文件中的条目的页面。

<!DOCTYPE html>
<html lang="da">

<html>

<head>

    <title>Mobiloversigt</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="stylesheet.css">

</head>

<body>

    <div class= "logo">

        <img src="Mobilsiden.png" alt="Mobilsiden Logo" style="width:20%;height:20%;">

    </div>

    <div class="boks">

    <h1>Tilføjede enheder</h1>

    <div class="linie"></div><br>

    <?php

    $info = explode(",", file_get_contents("mobile.txt"));
    $retrieved_string = file_get_contents("data.txt");

    $retrieved_array = explode("\n", $retrieved_string);

    $count=count($retrieved_array)-1;

    for($y = 0; $y < $count; $y++){
    $user_data_array = explode(",",$retrieved_array[$y]);
    for($x = 0; $x <= 4; $x++){
        echo "<p>$info[$x]</p><p2>$user_data_array[$x]</p2><br>";
}       echo "<img src=\"$user_data_array[5]\"><br><br>";
        echo "<div><span class=\"linie\"></span></div><br><br>";
}


?>        

    </div>
</body>
</html>

我知道这是一个很长的帖子，但我只是想确保可能的解决方案制作者对我的代码有完整的概述。我希望这不是问题。

由于我是PHP的新手，如果可能的话，我希望有一个更容易理解的答案： - ）

提前致谢！

Answer 1

将用户提交的数据存储在文本文件中而不首先处理数据存在一些问题。例如，如果用户输入逗号,，那么当您检索数据时它会中断explode()，或者如果用户输入换行符，它也会导致问题。

您可以使用一个函数来清除您识别的任何字符的用户提交数据。

function cleanStr($str) {
    // remove extra whitespace
    $str = preg_replace('/[ \t]+/', ' ', $str);
    // remove linebreaks
    $str = preg_replace( "/\r|\n/", "", $str );
    // remove html tags
    $str = strip_tags($str);
    return $str;
}

使用示例：

$manufactor = cleanStr($_POST['manufactor']);

如果您将文本文件中的数据存储为json，则对用户输入更加健壮，因为文本中的逗号不会破坏它。

$user_data = array($manufactor, $product, $color, $memory, $displaysize, $name);
$user_data = json_encode($user_data)." \r\n";

然后以与当前相同的方式将数据保存到文件中：

$fh = fopen("data.txt", "a")   or die("Filen kunne ikke oprettes");
fwrite($fh, $user_data)         or die("Kunne ikke skrive til filen");
fclose($fh);

然后在想要显示数据时解码json。

$user_data_array = json_decode($retrieved_array[$y]);

在Safari中使用PHP但在Chrome中没有问题

1 个答案: