1 
<!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>
4

2 回答 2

4

你的范围x是问题。x是jobID的本地。在函数之外声明x。

var x;
function jobID(form){
    x = document.forms["JobIdForm"]["jobid"].value;
    return false;
}
于 2013-08-06T13:48:48.387 回答
0

尝试这样的事情：

js

 $(function(){  //equivalent to $(document).read(function(){});
    //you are running "joID(form)" on submit now, but have it written/called right in the html.  i try to avoid that.
      $("form[name='JobIdForm']").submit(function(event){
//i did not see an actual form[action] value, so I preventDefault() to call that out
        event.preventDefault();
//we want the value in bob, so I have jQuery create a <div> and throw the input value between the element tags
        $("#bob").append($("<div>"+$(this).find("input[name='jobid']").val()+"</div>");
      });

    });

完成上述工作所需的 html：

<form name="JobIdForm" action="" method="post">       
    <label>Job ID <input type="text" name="jobid"></label>
    <input type="submit" value="Submit">    

</form>
于 2013-08-06T13:49:31.833 回答