javascript - 分配变量以形成输入值并使用jquery打印 | 分配变量以形成输入值并使用jquery打印

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href = "Jquery.css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>

        var amount = new Array();
        var x;
        amount[0] = 1;

        function jobID(form){

            x = document.forms["JobIdForm"]["jobid"].value;
            return false;


        }

        $(document).ready(function(){
            jQuery('<div/>', {
                id: 'box',


                click: function(){
                    jQuery('<div/>', {
                        id: 'bob'+amount.length
                    }).appendTo('#scroller');
                    jQuery('<div/>', {
                        id: 'bobb'+amount.length
                    }).appendTo('#scroller');
                    jQuery('<div/>', {
                        id: 'bobbb'+amount.length
                    }).appendTo('#scroller');
                    $('#bob'+amount.length).css('width', '200px');
                    $('#bob'+amount.length).css('height', '80px');
                    $('#bob'+amount.length).css('background-color', '#F2F2F2');
                    $('#bob'+amount.length).css('border', '3px solid black');
                    $('#bob'+amount.length).css('margin-top', '10px');
                    $('#bobb'+amount.length).append(x);


                    $('#bobb'+amount.length).css('width', '130px');
                    $('#bobb'+amount.length).css('height', '80px');
                    $('#bobb'+amount.length).css('background-color', '#F2F2F2');
                    $('#bobb'+amount.length).css('border', '3px solid black');
                    $('#bobb'+amount.length).css('margin-top', '-86px');
                    $('#bobb'+amount.length).css('margin-left', '220px');
                    $('#bobb'+amount.length).append('hello');

                    $('#bobbb'+amount.length).css('width', '300px');
                    $('#bobbb'+amount.length).css('height', '80px');
                    $('#bobbb'+amount.length).css('background-color', '#F2F2F2');
                    $('#bobbb'+amount.length).css('border', '3px solid black');
                    $('#bobbb'+amount.length).css('margin-top', '-86px');
                    $('#bobbb'+amount.length).css('margin-left', '370px');
                    $('#bobbb'+amount.length).append('hello');

                    amount[amount.length] = 1;

                }


            }).appendTo('body');
            $('#box').append("Submit All");
        });
    </script>
</head>

<body>

    <header>
        <h1>Fill out Forms</h1>
    </header>
    <section>
        <div id="keys">
            <div id ="job">
                <p>Job ID</p>
            </div>
            <div id="date">
                <p>Date</p>
            </div>
            <div id="desc">
                <p>Description</p>
            </div>
        </div>
        <div id = "scroller" style="width: 700px; height: 400px; overflow-y: scroll;">

        </div>

        <form name="JobIdForm" action="" onsubmit="return jobID(this)" method="post">


            Job ID <input type="text" name="jobid">
            <input type="submit" value="Submit">




        </form>
    </section>


</body>
</html>

最佳答案

您的x范围是问题所在。 x对于jobID是本地的。在函数外部声明x。

var x;
function jobID(form){
    x = document.forms["JobIdForm"]["jobid"].value;
    return false;
}

关于javascript - 分配变量以形成输入值并使用jquery打印，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18081917/