javascript - 将值推送到 html 并从 JS 再次获取-6ren

javascript - 将值推送到 html 并从 JS 再次获取

转载作者：行者123 更新时间：2023-11-29 19:01:18

我想为隐藏的输入分配一个值，然后使用输入 id 从 javascript 的下一部分获取该值。所以它会根据从 javascript 的第一部分分配的隐藏输入值来提醒值。但是，它看起来没有用，这对我当前的任务很重要。我必须将值推送到 HTML，然后在 javascript 变量中再次取回它。如果您有任何解决方案，请告诉我。

<!DOCTYPE html>
    <html>
    <head>
        <title>Just test</title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.18/pdfmake.min.js"></script>

    </head>
    <body>
<script>
    var myVal = "some string";
    $("#foo").val(myVal);
</script>

<input type="hidden" name="foo" id="foo" value="">


<script>
    var doo = "";
    doo = $(this).find("#foo").val();
    if (doo != "") {
        alert(doo);
    }else{
        alert("doo is null");
    }
</script>
    </body>
    </html>

最佳答案

您可以使用 $(document).ready() 方法等待所有 DOM 元素呈现。然后执行JS代码。您可以阅读更多相关信息 here

<!DOCTYPE html>
    <html>
    <head>
        <title>Just test</title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.18/pdfmake.min.js"></script>

    </head>
    <body>

        <script>
          $(document).ready(function(){
            var myVal = "some string";
             $("#foo").val(myVal);
          });
             
        </script>

        <input type="hidden" name="foo" id="foo" value="">


        <script>
          $(document).ready(function(){
            var doo = "";
            doo = $(this).find("#foo").val();
            if (doo != "") {
                alert(doo);
            }else{
                alert("doo is null");
            }
            
          });
        </script>
    </body>
</html>