【发布时间】：2011-01-31 21:12:12
【问题描述】：
我正在尝试根据表单中的下拉选择来交换 2 个元素的可见性。
如果用户选择了前 6 个项目中的任何一个，“消息”区域仍然存在。
如果用户选择最后一项“Reproduction Rights”，则“Message”消失并与“Rights message”div 交换。
我可以使用显示/隐藏复制权限，但不能使用消息框。我是java新手，请原谅我的无知。这是完整页面代码或查看Paul-Rand.com：
可以使用此代码，但有更简洁的方法吗？
<!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>
<title>Paul-Rand.com :: Contact Us</title>
{embed=site/meta}
<link rel="stylesheet" type="text/css" href="{stylesheet=styles/twocolumn}" />
<link rel="stylesheet" type="text/css" href="{stylesheet=styles/global}" />
<script type="text/javascript" src="{path=scripts/livevalidation_standalone}"></script>
<script type="text/javascript">
// <![CDATA[
function display(obj,id1,id2) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
if ( txt.match(id1) ) {
document.getElementById(id1).style.display = 'block';
}
if ( txt.match(id2) ) {
document.getElementById(id2).style.display = 'block';
}
}
// ]]>
</script>
</head>
<body>
{embed="site/mainNav"}
<div id="container">
<div id="centercontent">
<h1>Contact Us</h1>
<div class="form-left">
<p>To send us a message, please fill out the form below. We'll get back to you shortly!</p>
{exp:freeform:form
required="name|email|message"
collection="Contact Form"
return="site/success"
notify="dlewandowski38@yahoo.com"
template="randContact"
file_upload="Email attachments"
send_attachment="yes" }
<label>Name / Company Name <em>(required)</em>
<br style="clear:both">
<span><input type="text" name="name" id="Name" class="formMediumText"/></span>
</label>
<script type="text/javascript">var Name = new LiveValidation('Name');Name.add(Validate.Presence);</script>
<label>Email <em>(required)</em>
<br style="clear:both">
<span><input type="text" name="email" id="Email" class="formMediumText"/></span>
<script type="text/javascript">var Email = new LiveValidation('Email');Email.add(Validate.Email );</script>
</label>
<label>Regarding
<br style="clear:both">
<span>
<select name="regarding" id="Regarding" class="formMediumText" onchange="display(this,'subject','Reproduction Rights');">
<option value="subject">General Inquiry</option>
<option value="subject">Suggestion for the site</option>
<option value="subject">Problem with the site</option>
<option value="subject">Work to Share</option>
<option value="subject">Story to Share</option>
<option value="subject">Pictures to Share</option>
<option value="Reproduction Rights">Reproduction Rights</option>
</select>
</span>
</label>
<div id="Reproduction Rights" style="display: none; float:left;background-color: #ff9900; padding: 20px;">
<h4 style="text-transform: uppercase; padding: 0; margin:0;">Reproduction rights are granted through the Paul Rand estate only.</h4>
<p style="padding: 0; margin: 0;">Contact the <a href="http://www.library.yale.edu/mssa/" target="_blank">Yale Archives</a> with a detailed description of your planned usage and they will process your request.</p>
</div>
<div id="subject" style="display: none">
<label>Message
<br style="clear:both">
<span>
<textarea cols="24" rows="12" name="message" id="Message" class="formMediumText"></textarea>
</span>
</label>
</div>
<br style="clear:both"/>
<hr/>
<h2 style="margin-bottom:-18px">Help the site grow</h2>
<h5 style="margin-bottom:-6px">Have a piece of Paul Rand work that's not seen on the site? Share it! </h5>
<p>Send your files (any image type, 800px wide or larger), your name and website (if available). I'll add it to the appropriate gallery and give you credit for your addition.</p>
<p>Your contributions are GREATLY APPRECIATED!</p>
<br/>
<label for="file" style="float:left;">Share a File (up to 5 per message):</label>
<span><input type="file" name="file1" id="file1" class="formPicBrowse"/></span>
<span><input type="file" name="file2" id="file2" class="formPicBrowse"/></span>
<span><input type="file" name="file3" id="file3" class="formPicBrowse"/></span>
<span><input type="file" name="file4" id="file4" class="formPicBrowse"/></span>
<span><input type="file" name="file5" id="file5" class="formPicBrowse"/></span>
<br style="clear:both"/>
<br/>
{if captcha}
<label>For security, please enter the word you see below:
<br style="clear:both">
<p style="width:160px;">{captcha}</p>
<span><input type="text" name="captcha" onfocus="if(this.value == 'Security Code') { this.value = ''; }" value="Security Code" id="Captcha" class="formMediumText" style="width:130px" /></span>
<script type="text/javascript">var Captcha = new LiveValidation('Captcha');Captcha.add(Validate.Presence);</script>
</label>
{/if}
<br style="clear:both"/>
<br/>
<p><input type="submit" name="submit" value="Send" class="buttons" style="font-size:18px; padding-top:8px;"/></p>
{/exp:freeform:form}
</div>
<script type="text/javascript">
var Name = new LiveValidation( 'Name', {onlyOnSubmit: true } );
Name.add( Validate.Presence );
var Email = new LiveValidation( 'Email', {onlyOnSubmit: true } );
Email.add( Validate.Presence );
var Message = new LiveValidation( 'Message', {onlyOnSubmit: true } );
Message.add( Validate.Presence );
var Captcha = new LiveValidation( 'Captcha', {onlyOnSubmit: true } );
Captcha.add( Validate.Presence );
</script>
</div>
</div>
{embed=site/bottomSection}
{embed=site/footer}
{embed=site/googleTracking}
</body>
</html>
【问题讨论】：
-
我是 java 新手。不，您是 JavaScript 的新手。 Java 是一种完全不同的语言。
-
使用当前工作示例更新了代码。任何更清洁，更合适的方法？谢谢！
-
试试 jQuery jquery.com
标签： javascript html css forms field