堆棧內存溢出
  簡體   English   中英

無法使用javascript（初學者）-請檢查我的代碼

[英]Can't get javascript working (beginner) - please check my code

 原文  2015-02-01 10:30:27  6   3    javascript/ jquery/ html

問題描述

我是腳本等方面的新手，因此，如果您能告訴我（a）為什么我的代碼無法正常工作，以及（b）您可以提供的其他有用提示，我將不勝感激。 我敢肯定原因很簡單:)。 很高興收到任何反饋。

我只是在設計一個基本的計算器-用戶輸入動物的體重，脫水水平和另一個數字，而javascript進行了一些計算以輸出流體速率（用於計算流體應多快流入患病動物）。

編碼： 

 $(document).ready(function() { document.write("this script is working"); // Veterinary Calculator Code // update maint, replacement, dailyRequirement and rate when bw, dh or ol changes. function updateDetails() { // define variables for body weight, dehydration and ongoing losses var $bw = $('#bodyWeight'); var $dh = $('#dehydration'); var $ol = $('#ongoingLosses'); var $dr = $('#dailyRequirement'); var $repl = $('#replacement'); var $rt = $('#rate'); var mt = (1.5 * (70 * (math.pow($bw.val, 0.75)))); // maintenance requirement $dr.text(mt + 'ml/24 hours'); var rep = $bw * 0.01 * $dh; $repl.text(rep + 'ml'); var rt = ((mt + rep + $ol.val)/24); $rt.text(rt + "ml/hr"); } // add event listeners for input elements $bw.on('change', updateDetails()); $dh.on('change', updateDetails()); $ol.on('change', updateDetails()); } 
 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame Remove this if you use the .htaccess --> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Veterinary Calculators</title> <meta name="description" content=""> <meta name="author" content="Cameron Fay"> <meta name="viewport" content="width=device-width; initial-scale=1.0"> <!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references --> <link rel="shortcut icon" href="favicon.ico"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> </head> <body> <div> <header> <h1>Fluid Calculator</h1> </header> <div> <fieldset id="params"> <legend>Inputs</legend> <label>Body Weight (kg):</label><br /> <input type="number" id="bodyWeight" autofocus min="0" /> <br><br /> <label>% Dehydration:</label><br /> <input type="number" id="dehydration"/> <br /><br /> <label> Losses (ml):</label><br /> <input type="number" id="ongoingLosses" /> <br /><br /> </fieldset><br /> <label>Daily Requirement:</label> <label class="result" id="dailyRequirement"></label> <br /> <label>Replacement:</label> <label class="result" id="replacement"></label> <br /> <br /> <label> Rate (ml/hr):</label> <label class="result" id="rate"></label> </div> <footer> <p> &copy; Copyright 2015 by VETsharp Pty Ltd </p> </footer> </div> <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.2.min.js"></script> <script type="text/javascript" src="vc.js"></script> </body> </html>

3 個解決方案

解決方案1
 0  2015-02-01 10:33:41

您應該為事件處理程序提供函數引用。 像這樣修復您的代碼： 

$bw.on('change', updateDetails);
$dh.on('change', updateDetails);
$ol.on('change', updateDetails);

區別在於updateDetails()立即執行該函數並返回undefined事件處理程序，因此基本上根本沒有注冊任何處理程序。

另一個問題是您需要將變量定義移到updateDetails函數之外： 

var $bw = $('#bodyWeight');
var $dh = $('#dehydration');
var $ol = $('#ongoingLosses');
var $dr = $('#dailyRequirement');
var $repl = $('#replacement');

function updateDetails() { ... }

解決方案2
 0  2015-02-01 10:39:14

從哪兒開始...

  • 您錯過了結尾)和; 准備好文檔之后。
  • 您試圖在函數內部聲明一個新函數。
  • 您正在嘗試將$ .on與舊版本的jquery一起使用。

我可能一眼就看不到更多。 您的空格和縮進總體來說是可怕的。

解決方案3
 0 已采納  2015-02-01 10:42:21

問題 ：

  1. 您在函數內部聲明了var ，但是在var未知（超出函數范圍）的地方綁定了change事件。 因此，您必須在函數范圍之外的父范圍內聲明它們。

  2. 它是.val() ，在jQuery中不是.val 。

  3. 當在.on()方法中觸發事件時，您需要傳遞函數指針。 它稱為事件處理程序。 這與調用函數不同。 所以是

$bw.on('change', updateDetails); 不是$bw.on('change', updateDetails());

解決方案：這就是您的腳本的外觀， 

$bw = $('#bodyWeight');
$dh = $('#dehydration');
$ol = $('#ongoingLosses');

//update maint, replacement, dailyRequirement and rate when bw, dh or ol changes.
function updateDetails()    {
// define variables for body weight, dehydration and ongoing losses
   var $dr = $('#dailyRequirement');
    var $repl = $('#replacement');

    var $rt = $('#rate');

    var mt = (1.5 * (70 * (Math.pow($bw.val(), 0.75))));    // maintenance requirement
    $dr.text(mt + 'ml/24 hours');

    var rep = $bw.val() * 0.01 * $dh.val();
    $repl.text(rep + 'ml');

    var rt = ((mt + rep + $ol.val())/24);
    $rt.text(rt + "ml/hr");
}



// add event listeners for input elements
$bw.on('change', updateDetails);
$dh.on('change', updateDetails);
$ol.on('change', updateDetails);

的jsfiddle

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 我不明白為什么我的代碼不起作用有人可以檢查一下嗎？ 我很新 (JavaScript) 為什么我的check（）函數在JavaScript中不起作用？ 請有人檢查我的代碼 無法通過JavaScript驗證我的“代碼” 無法使我的JS代碼正常工作 我是一個javascript初學者，我無法在瀏覽器上運行此代碼 控制台無法從ATOM運行我的Javascript代碼嗎？ **初學者 為什么我的重定向代碼不起作用，但我的警報有效？ 請更正我的代碼並檢查 似乎無法獲得示例代碼來替換有效的復選框 Javascript初學者：無法在多個對象上執行函數 試圖建立一個HTML toutuorial，並且無法讓我的javascript檢查我的文本框的值以被javascript檢查
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM