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

來源

2013-08-06 Greg Peckory

您的範圍x是問題所在。 x是jobID的本地。聲明x以外的功能。

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

來源

2013-08-06 13:48:48 j08691

+1的範圍問題 – DefyGravity

這不起作用無論是。我的代碼必須有更多問題。但是，無論如何感謝修復。 –

感謝您的回答！ –

嘗試這樣：

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-06 13:49:31 DefyGravity

是的，j08691的關於x var範圍的帖子是爲什麼它不工作atm – DefyGravity

我將發佈我的所有代碼，我可能在我的代碼中有另一個問題。 –

我想避免這種情況，因爲我認爲我的代碼有點凌亂，無法在您的最後閱讀 –

指定變量以形成輸入值並使用jquery打印

回答

JS

HTML作出上述工作所需：

相關問題