從Javascript代碼中提取約10個變量（運行後）並寫入頁面？

我完成了我的Javascript代碼和它的約3000行。有代碼（60+）內的許多變量，但也有一些變量，我想寫信給我的網頁，如從Javascript代碼中提取約10個變量（運行後）並寫入頁面？

totalTime 
longitudinalAcceleration 
shiftTime 
numberOfShifts 
corneringTime 
numberOfCorners 
instantaneousCoefficientOfFriction 
totalFuel 
meanLongAccel 
meanHorsepower

這些JScript代碼（在所有變量不包括在內，因爲它會太長）。我希望能夠做的就是將這段代碼寫入我調用函數的主HTML頁面。這個javascript函數被稱爲images.js（不要問大聲笑）。我很確定我需要一個輸出變量，這是Jscript文件中的一個對象。這部分我不太確定如何去做，或者稍後如何在實際的HTML頁面中編寫對象變量的一部分。

基本上我運行image.js中包含的Main Calculation（）函數運行後，我想拉這些變量並將它們寫入我的HTML頁面。這些是你在上面看到的變量。計算完成後，如何獲取這些變量？我很確定我需要使用jQuery或Javascript將變量寫入頁面？

下面是該頁面的鏈接，如果它有助於 http://www.fsaesim.com/Products.html

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
    <script type="text/javascript" src="images.js"></script> 
    <script type="text/javascript"> 
     function ShowCalculation() { 
      Main($("#vehicleWeightTxt").val(), $("#tireChoiceSel").val(), $("#wheelBaseTxt").val(), $("#wheelRadiusTxt").val(), $("#trackWidthTxt").val(), $("#hcgTxt").val(), $("#weightDistributionTxt").val(), $("#shiftRpmTxt").val(), $("#ntTxt").val()); 


     } 
    </script> 

</head> 

<body id="page4"> 
    <div class="body1"> 
    <div class="body2"> 
    <div class="body5"> 
     <div class="main"> 

      <header> 
       <div class="wrapper"> 
       <h1><a href="index.html" id="logo">Progress Business Company</a></h1> 
       <nav> 
        <ul id="menu"> 
         <li id="nav1" class="active"><a href="index.html">Home<span>Page</span></a></li> 

         <li id="nav2"><a href="News.html">News<span>Updates</span></a></li> 

         <li id="nav3"><a href="Services.html">Available<span>Features</span></a></li> 

         <li id="nav4"><a href="Products.html">Run<span>Simulation</span></a></li> 

         <li id="nav5"><a href="Contacts.html">Contact<span>Support</span></a></li> 
        </ul> 
       </nav> 
       </div> 
      </header> 

     </div> 
    </div> 
    </div> 
    </div> 
    <div class="body1"> 
     <div class="main"> 
     <br /> 
     <table border="0"> 
     <tr> 
     <td> 
     Tire Choice 
     </td> 
     <td> 
     <select id="tireChoiceSel"> 
     <option value="1">Michelin 13"</option> 
     <option value="2">Hoosier 13" Large</option> 
     <option value="3">Hoosier 13" Small</option> 
     <option value="4">Mexican Tires</option> 
     </select> 
     </td> 
     <td> 
     Engine: 
     </td> 
     <td><select id="engineSelectionSel"> 
     <option value="1">Yamaha R6 - 4 Cylinder</option> 
     <option value="2">Yamaha WR450 - 1 Cylinder</option> 
     <option value="3">Honda CBR600RR - 4 Cylinder </option> 
     <option value="4">Suzuki GSXR600 - 4 Cylinder</option> 
     </select> 
     </td> 
     <td> 
     Torque Curve: 
     </td> 
     <td> 
     <select id="torqueCurveSel"> 
     <option value="1">Cornell Curve 2008</option> 
     <option value="2">MIT Curve 2008</option> 
     <option value="3">RMIT Curve 2008 </option> 
     <option value="4">Fullerton Curve 2008</option> 
     </select> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Vehicle Weight: 
     </td> 
     <td> 
     <input type="text" id="vehicleWeightTxt" value="530" size="3" /> 
     </td> 
     <td> 
     Number of NOS: 
     </td> 
     <td> 
     <input type="text" id="Text1" value="100" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #1: 
     </td> 
     <td> 
     <input type="text" id="Text2" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Wheel Base: 
     </td> 
     <td> 
     <input type="text" id="wheelBaseTxt" value="61" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #2: 
     </td> 
     <td> 
     <input type="text" id="Text3" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #3: 
     </td> 
     <td> 
     <input type="text" id="Text4" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Wheel Radius: 
     </td> 
     <td> 
     <input type="text" id="wheelRadiusTxt" value="10.25" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #4: 
     </td> 
     <td> 
     <input type="text" id="Text5" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #5: 
     </td> 
     <td> 
     <input type="text" id="Text6" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Track Width: 
     </td> 
     <td> 
     <input type="text" id="trackWidthTxt" value="50" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #6: 
     </td> 
     <td> 
     <input type="text" id="Text7" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #7: 
     </td> 
     <td> 
     <input type="text" id="Text8" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Center of Gravity: 
     </td> 
     <td> 
     <input type="text" id="hcgTxt" value="12" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #8: 
     </td> 
     <td> 
     <input type="text" id="Text9" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #9: 
     </td> 
     <td> 
     <input type="text" id="Text10" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Weight Distribution: 
     </td> 
     <td> 
     <input type="text" id="weightDistributionTxt" value="0.50" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #10: 
     </td> 
     <td> 
     <input type="text" id="Text11" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #11: 
     </td> 
     <td> 
     <input type="text" id="Text12" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Shift RPM: 
     </td> 
     <td> 
     <input type="text" id="shiftRpmTxt" value="9500" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #12: 
     </td> 
     <td> 
     <input type="text" id="Text13" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #13: 
     </td> 
     <td> 
     <input type="text" id="Text14" value="3000" size="3" /> 
     </td> 
     </tr> 

     <tr> 
     <td> 
     Final Drive Ratio: 
     </td> 
     <td> 
     <input type="text" id="ntTxt" value="2.86" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #14: 
     </td> 
     <td> 
     <input type="text" id="Text15" value="3000" size="3" /> 
     </td> 
     <td> 
     NOS Bottle #15: 
     </td> 
     <td> 
     <input type="text" id="Text16" value="3000" size="3" /> 
     </td> 
     </tr> 


















     </table> 



    <center><input type="submit" value="Calculate" onclick="ShowCalculation(); return false;" /></center> 
     </div> 
    </div> 
    <div class="body4"> 
     <div class="main"> 
      <article id="content2"> 
       <div class="wrapper"> 
        <section class="col3"> 
         <h4>Why Us?</h4> 
         <ul class="list1"> 

          <li><a href="#">Professional Engineers</a></li> 

          <li><a href="#">Years of Experience</a></li> 

          <li><a href="#">Vehicle Dynamics Experts</a></li> 
         </ul> 
        </section> 
        <section class="col3 pad_left2"> 
         <h4>Address</h4> 
         <ul class="address"> 
          <li><span>Location:</span>United States, CA</li> 

          <li><span>City:</span>Northridge</li> 

          <li><span>Phone:</span>1-888-888-8888</li> 

          <li><span>Email:</span><a href="mailto:[email protected]">Contact Us</a></li> 
         </ul> 
        </section> 
        <section class="col3 pad_left2"> 
         <h4>Follow Us</h4> 
         <ul id="icons"> 
          <li><a href="#"><img src="images/icon1.jpg" alt="">Facebook</a></li> 
          <li><a href="#"><img src="images/icon2.jpg" alt="">Twitter</a></li> 

         </ul> 
        </section> 
        <section class="col2 right"> 
         <h4>Search The Site</h4> 
         <form id="newsletter" method="post"> 
          <div> 
           <div class="wrapper"> 
            <input class="input" type="text" value="Type Your Email Here" onblur="if(this.value=='') this.value='Type Your Email Here'" onFocus="if(this.value =='Type Your Email Here') this.value=''" /> 
           </div> 
           <a href="#" class="button" onClick="document.getElementById('newsletter').submit()">Search</a> 
          </div> 
         </form> 
        </section> 
       </div> 
      </article> 
<!-- content end --> 
     </div> 
    </div>

來源

2011-08-30 Spets

其有點不清楚正是你想做的事。 –

是的，我也不確定，這聽起來像你需要編寫特定的方法來提取你想要的特定變量？ – Psyrus

一旦我運行image.js文件或MainCalculation（）函數的計算，我想返回MainCalculation（）結尾的變量到我正在處理的當前頁面 – Spets

，如果我得到它的權利，你計算這些值，他們是要顯示的結果，

我建議創建要顯示他們（如，在計算按鈕）一個div（或一個模式框，將取代警報）。

和JS，有點基本的，但好：

var stuffToShow = [ 
'totalTime', 
'longitudinalAcceleration', 
'shiftTime', 
'numberOfShifts', 
'corneringTime', 
'numberOfCorners', 
'instantaneousCoefficientOfFriction', 
'totalFuel', 
'meanLongAccel', 
'meanHorsepower' 
]; 

var someHtml = ''; 
$(stuffToShow).each(function() { 
    someHtml += '<div id="'+this+'">'+this+': '+youResultObject[this]+</div>; 
}); 

$('#yourResultDiv').html(someHtml).slidedown('slow');

來源

2011-08-30 22:12:00 roselan

我要試試這個，雖然我不完全理解這裏發生了什麼。這一切都在腳本頁面下的HTML頁面中？「youResultObject」是我對的對象？ – Spets

順便說一句，我所有的變量都是數值，看起來好像我試圖顯示字符串？ – Spets

這會在你的images.js文件中找到，最好在以$（document）.ready（...）或$（function ...）開頭的部分中，yourResultObject確實是你的對象。轉換是自動的。 – roselan

這是不完全清楚你正在嘗試做的，但如果這個頁面是從基於JavaScript的網頁，做鏈接在計算中，您可以使用GET或POST來傳遞變量（請參閱：http://www.php.net/manual/en/reserved.variables.post.php）。

如果你正在嘗試改變使用php基於運行在同一頁面的JavaScript的HTML，這將是不可能的。在這種情況下，我推薦只使用javascript，而不是php。

來源

2011-08-30 21:52:35 someone

沒有使用任何php對不起有關php的標籤讓我刪除它一秒 – Spets

好吧，假設你有一個JavaScript對象e.g

var data = { totalTime: 12, shiftTime: 10 }

你可以通過數據對象的循環中，創建一個標籤，在對陣列中的每個數據項的輸入。假設您希望在一個名爲show_data的div中顯示該內容

for(var i in data) 
{ 
    $('#show_data').append("<label for='"+ i + "'>" + i + "</label>"); 
    $('#show_data').append("<input id='"+ i +"' value='"+ data[i] + "' />"); 
{

不確定這是否是您要求的。這可以提高很多，但它給你一個粗略的想法。

來源

2011-08-30 22:05:33

看來，你的images.js文件進行模糊處理。我在這裏出去走走，但是你可能會問如何在編譯之前訪問該文件中定義的變量名稱之前。如果是這種情況，我有幾個建議...

首先，不要模糊你的代碼，它是毫無意義的，會影響性能。如果這不是一個選項，那麼混淆器可能會讓您定義特定的關鍵字而不是;在混淆器的配置中設置要訪問的變量。

如果沒有這種幫助，那麼你可能會需要發佈更多的信息。

來源

2011-08-30 22:05:53

從Javascript代碼中提取約10個變量（運行後）並寫入頁面？

回答

相關問題