javascript - 如何将html中span的值传递给其他页面

Question

我想传递我的 span html 的值，它是来自 javascript 的值。它将计算上传文件的字数。请帮帮我。

这是我的第一页index.php

<form name="myform" action="values.php" method="post">
   <input name="upload" type="file" id="upload" accept="text/plain" accesskey="u"> UPLOAD A FILE
   <span id="display_File_count" name="display_File_count"></span> <span>Words</span>
   <input type="submit" value="Submit">
</form>

<script type="text/javascript">

    $('#upload').change( function(event) {

        var f = event.target.files[0];
        if (f) {
            var r = new FileReader();

            r.onload = function(e) { 
                var contents = e.target.result;
                var res = contents.split(" "); 
                $("#display_File_count").text(res.length);
            }
            r.readAsText(f);
        }
    });

</script>

这是将调用该值的另一​​个页面 values.php

<input type="text" name="count_upload" id="count_upload" value="<?php echo $_POST["display_File_count"] ?>" >

Answer 1

您可以添加一个包含文件计数(从 js 更新)和提交按钮以将数据发送到其他页面的隐藏输入:

<form name="myform" action="values.php" method="post">
    <input name="upload" type="file" id="upload" accept="text/plain" accesskey="u">
    UPLOAD A FILE

    <span id="display_File_count" name="display_File_count"></span><span>Words</span>

     <input type="hidden" name="display_File_count" class='display_File_count' />

     <input type='submit' value='send data to the other page' />
</form>

要从 js 更新字段，您可以使用:

...
r.onload = function(e) { 
    var contents = e.target.result;
    var res = contents.split(" "); 
    $("#display_File_count").text(res.length);

    $(".display_File_count").val(res.length);
}
...

当您点击提交按钮时，参数 display_File_count 将自动发送到 values.php 并使用 post 方法，因此您应该在values.php 输入由 display_File_count 自动填充，因为您在另一侧使用 $_POST["display_File_count"]。

希望这对您有所帮助。