Drupal页面:http://www.vertexwaterfeatures.com/herbicide-calculators
关键是我不需要模板,所以我想我只是将一个纯HTML页面放入站点中,但是js无法正常工作-我尝试了链接,但也无效。
我显然遗漏了一些东西...
这是代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Herbicide Calculators</title>
<style type="text/css">
.calculator {float: left;width: 280px;padding: 5px;margin: 0 5px 5px;border-radius: 5px;-moz-border-radius: 5px;border-width: thin;border-style: solid;color: #000;}
.calculator .form-row {overflow: auto;padding: 2px 2px;border: thin solid #D6D6D6;font-family: Arial, Helvetica, sans-serif;font-size: 14px;}
.calculator .form-row LABEL {float: left;width: 150px;line-height: 1.1em;}
.calculator .form-row INPUT {float: right;width: 110px;}
.calculator .form-row.last-row {background-color: #E0E0E0;}
.calculator .form-row-buttons {text-align: center;margin-top: 5px;}
.calculator SMALL {line-height: 0.7em;font-size: 10px;}
.calculator DD {font-size: 11px;font-style: italic;margin-bottom: 0;}
.calculator DT {font-size: 11px;
font-weight: bold;
}
</style>
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
$('#a_qty_calculator').submit(function() {
a_qty_calc();
return false;
});
$('#b_qty_calculator').submit(function() {
b_qty_calc();
return false;
});
});
function a_qty_calc() {
var pr = parseFloat($('#pr').val());
var sw = parseFloat($('#sw').val());
var ad = parseFloat($('#ad').val());
var dc = parseFloat($('#dc').val());
var pg = parseFloat($('#pg').val());
var ta = document.getElementById('totalPrice')
var ta = Math.round((pr * sw) / 43560 * 100) / 100;
var taf = Math.round(ad * ta * 100) / 100;
var ga = Math.round((taf * dc * 2.72) / pg * 100) / 100;
var oa = Math.round(ga * 128 * 100) / 100;
var gab = Math.round(ga / 1000 * 100) / 100;
var oab = Math.round(gab * 128 * 100) / 100;
$('#ta').val(ta);
$('#taf').val(taf);
$('#ga').val(ga);
$('#oa').val(oa);
$('#gab').val(gab);
$('#oab').val(oab);
}
function b_qty_calc() {
var wad = parseFloat($('#wad').val());
var wdc = parseFloat($('#wdc').val());
var wpg = parseFloat($('#wpg').val());
var wta = parseFloat($('#wta').val());
var wtaf = Math.round(wad * wta * 100) / 100;
var wga = Math.round((wtaf * wdc * 2.72) / wpg * 100) / 100;
var woa = Math.round(wga * 128 * 100) / 100;
var wgab = Math.round(wga / 1000 * 100) / 100;
var woab = Math.round(wgab * 128 * 100) / 100;
$('#wtaf').val(wtaf);
$('#wga').val(wga);
$('#woa').val(woa);
$('#wgab').val(wgab);
$('#woab').val(woab);
}
</script>
</head>
<body>
<form action="" class="calculator" id="a_qty_calculator" method="post">
<h3>Perimeter Treatment</h3>
<div class="form-row optional">
<label for="pr">Perimeter</label>
<input id="pr" name="pr" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="sw">Swath Width</label>
<input id="sw" name="sw" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="ad">Average Depth</label>
<input id="ad" name="ad" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="dc">Desired Concentration</label>
<input id="dc" name="dc" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="pg">Lbs of AI/Gallon</label>
<input id="pg" name="pg" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="ta">Treatment Acres</label>
<input id="ta" name="ta" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="taf">Treatment Area Acre Ft</label>
<input id="taf" name="taf" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="ga">Gallons to Apply PPM</label>
<input id="ga" name="ga" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="oa">Ounces to Apply PPM</label>
<input id="oa" name="oa" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="gab">Gallons to Apply PPB</label>
<input id="gab" name="gab" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="oab">Ounces to Apply PPB</label>
<input id="oab" name="oab" type="text" value="0" />
</div>
<div class="form-row-buttons">
<input type='submit' id='submit' value="Calculate" />
<input name="reset" type="reset" value="Reset" />
</div>
</form>
<form action="" class="calculator" id="b_qty_calculator" method="post">
<h3>Whole Lake Treatment</h3>
<div class="form-row optional">
<label for="wta">Treatment Acres</label>
<input id="wta" name="wta" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="wad">Average Depth</label>
<input id="wad" name="wad" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="wdc">Desired Concentration</label>
<input id="wdc" name="wdc" type="text" value="0" />
</div>
<div class="form-row optional">
<label for="wpg">Lbs of AI/Gallon</label>
<input id="wpg" name="wpg" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="wtaf">Treatment Area Acre Ft</label>
<input id="wtaf" name="wtaf" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="wga">Gallons to Apply PPM</label>
<input id="wga" name="wga" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="woa">Ounces to Apply PPM</label>
<input id="woa" name="woa" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="wgab">Gallons to Apply PPB</label>
<input id="wgab" name="wgab" type="text" value="0" />
</div>
<div class="form-row optional last-row">
<label for="woab">Ounces to Apply PPB</label>
<input id="woab" name="woab" type="text" value="0" />
</div>
<div class="form-row-buttons">
<input name="submit" type="submit" value="Calculate"/>
<input name="reset" type="reset" value="Reset" />
</div>
</form>
</body>
</html>
最佳答案
您应该在<script>
标记之前包含jquery库,如下所示;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
然后它可能会工作..