我是一名网络托管学生,所以我不是网络托管专家,我真的需要一些帮助。我有一个表格,在选择“公司”时会显示其他信息。
当它在编译器中运行时,它可以正常工作。但是当我使用浏览器打开时,它无效。[这是在浏览器中打开时的结果] [1]
<!---JS--->
$('select[name=type]').change(function () {
if ($(this).val() == '2') {
$('#companyinfo').show();
} else {
$('#companyinfo').hide();
}
});
<!--CSS-->
#companyinfo {
display:none;
}
<!--HTML CODE-->
<html>
<head>
<link rel="shortcut icon" href="favicon.ico" />
<link href="style/default.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="style/form.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="js/form.js" type="text/javascript"></script>
</head>
<body>
<table width="576" border="0" cellspacing="0" cellpadding="0" class="clear">
<tr>
<td><p style="font-size:16px; color:#518411;"></p><a name="top" id="top"></a>All fields marked with <FONT COLOR="#FF0000">*</FONT> are required.
</td>
</tr>
<tr>
<td height="20" > </td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr><td>PERSONAL INFORMATION</td></tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td height="22" class="bodyArial">E-mail Address<font color="#FF0000"> *</font></td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td valign="top"><input name="email" type="text" class="content-text-Darkgrey-BOX-long" id="email" size="30" />
<strong class="bodyArial"><font face="Arial, Helvetica, sans-serif"></font></strong></td>
</tr>
<tr>
<td valign="top"> </td>
</tr>
<tr>
<td>Enrolment Type</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><select name="type" required>
<option value="">-- Select an Option --</option>
<option value="1">Individual</option>
<option value="2">Company</option>
</select></td></tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
</table><br />
<table id="companyinfo">
<tr><td>COMPANY INFORMATION</td></tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Company Name<font color="#FF0000"> *</font></td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company1"><input name="companyname" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Date of Incorporation</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td valign="top"><label id="company2"><input name="companyday" type="text" class="content-text-Darkgrey-BOX-long" size="5" />
/ <input name="companymonth" type="text" class="content-text-Darkgrey-BOX-long" size="5" /> / <input name="companyyear" type="text" class="content-text-Darkgrey-BOX-long" size="5" /> <strong class="bodyArial"><font face="Arial, Helvetica, sans-serif"></font></strong> </label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td height="22" valign="top">Address</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td> <td height="22" valign="top"><label id="company3"><textarea name="companyaddress" cols="38" rows="5" class="content-text-Darkgrey-BOX-long" id="Address"></textarea></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Contact Person<font color="#FF0000"> *</font></td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company4"><input name="contactperson" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Position</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company5"><input name="position" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Tel No.<font color="#FF0000"> *</font></td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company6"><input name="companytel" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Mobile No.</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company7"><input name="companymobile" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Email Address<font color="#FF0000"> *</font></td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company8"><input name="companymail" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td>Websites</td>
<td valign="top" class="bodyArial"><div align="center" style="margin-right:10px;"><strong> : </strong></div></td>
<td><label id="company9"><input name="companysite" type="text" size="30" /></label></td>
</tr>
<tr>
<td colspan="3" height="10"></td>
</tr>
</table>
<br />
<p>COURSE TYPES (Please Tick)</p>
<table>
<tr>
<td colspan="3" height="10"></td>
</tr>
<tr>
<td><input type="checkbox" name="course" value="course1"></td>
<td> </td>
<td><b>Learner Heavy Machinery Operator Program (Level 1)</b><br> Duration: 8 Weeks<br> Pre-requisite: 18 years old, Valid Driving License<br> Vocational Training: Classroom + Practice </td>
</tr>
</table>
<br />
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="103" align="left">
<input name="submitbtn" type="image" onclick="return submit_form();" src="images/btn-submit.gif" alt="Submit" border="0" style="margin-right:20px;" /></td>
<td width="387"><a href="javascript:;"><img src="images/btn-reset.gif" alt="Reset" border="0" onclick="document.forms['form_contact'].reset()" /></a></td>
</tr>
</table>
</body>
</html>
答案 0 :(得分:0)
首先,您的脚本中有2个jquery min文件:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<html><head>
代码下,或</body>
代码&#34; $&#34;未定义错误主要发生在;
您的文件中有多个版本的jQuery;并且存在$ variable的冲突;例如:使用prototypejs和jquery。在这种情况下;使用方法:
jQuery.noConflict();
此外,在以下块中运行您的javascript代码:
$(document).ready(function () {
//your code here
});