There are two list boxes (SELECTs) in HTML and
When you change the selection of the first list,
Below is an example of the source, but if JavaScript is written or written in a bad place,
I'm thinking about it, but I can't solve it through trial and error.
*For HTML and JavaScript descriptions, use
from above when the browser reads HTML.
Read, interpret, and run, as described in JavaScript's beginner's description site.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<TITLE> Car and Color Selection</TITLE>
<STYLE type="text/css">
<!--
US>BODY{
border-top —2px#FF0000 solid;
text-align:center;
color:#000000;
}
-->
</STYLE>
<SCRIPT TYPE="text/javascript">
<!--
// Other Java Scripts
// -- >
</SCRIPT>
// I picked up the cord, but it doesn't work.
<SCRIPT TYPE="text/javascript">
<!--
functionDeleteListColor(x)
{
if(x.hasChildNodes()){
while(x.childNodes.length>0){
x.removeChild(x.firstChild)
}
}
}
// -- >
</SCRIPT>
</HEAD>
<!-------------------------------------------------------------------------
<!--body start---------------------------------------------------->
<BODY topmargin="0" leftmargin="0" marginwidth="0" marginheight="0">
<DIV>
<!--I picked up the code, but it doesn't work-->
<!--
comment out
<script type="text/javascript">
functionDeleteListColor(){
sl=document.form_list_color.getElementById('list_color')
while(sl.lastChild)
{
sl.removeChild(sl.lastChild);
}
}
</script>
-->
<!--I picked up the code, but it doesn't work-->
<!--
comment out
<script type="text/javascript">
functionDeleteListColor(){
varobj= document.getElementById('list_color');
varf = obj.form;
for (vari=0;i<f.length;i++) {
if(((f[i].type=="select-one")&(f[i]!=obj)){
f[i].selectedIndex=0;
}
}
}
</script>
-->
<!--- The simplification here below makes it look like a meaningless TABLE or submit -->
<!-- What I want to do is clear the list_color list when I change the list_car selection -->
<!--*After clearing -->
<FORM name="form_list_car" method="post" action="this.html">
<TABLE>
<CAPTION>1. Car Type List Box </CAPTION>
<TR>
<TD>
<SELECT name="list_car" onChange="DeleteListColor(list_color)">
<OPTION align="left" value="car1">CAR1</OPTION>
<OPTION align="left" value="car2">CAR2</OPTION>
<OPTION align="left" value="car3">CAR3</OPTION>
</SELECT>
</TD>
</TR>
</TABLE>
<!--In addition to clearing the color, there are many ways to use it, such as resetting the color to list_color to match the car model -->
<INPUT type="submit" name="submit_list_car" value="This sample is a recursive call button"/>
</FORM>
<BR>
<FORM name="form_list_color" method="post" action="next.html">
<TABLE>
<CAPTION>2. Car Color List Box</CAPTION>
<TR>
<TD>
<!-- Why size?It works only on personal computers.Pad or smartphone will be in one line -->
<SELECT name="list_color"size="3">
<OPTION align="left" value="red">Red</OPTION>
<OPTION align="left" value="yellow">Yellow</OPTION>
<OPTION align="left" value="black">Black</OPTION>
</SELECT>
</TD>
</TR>
</TABLE>
<INPUT type="submit" name="submit_list_color" value="Transition to next screen"/>
</FORM>
</DIV>
</BODY>
</HTML>
That's all.
javascript html
●Problems with the second and third DeleteListColor()
document.getElementById('list_color')
, but there is no element in the document with the ID list_color
.
A second <select>
with id='list_color'
or document.querySelector('select[name=list_color]')
and so on.
●3rd DeleteListColor()
Problem
If you resolve the above issue, this code is not what you want.Don't try to copy it without understanding how it works.
●Calling party problem
<SELECT name="list_car" onChange="DeleteListColor(list_color)">
The variable list_color
does not exist, so I think there is an exception.Like the first problem, you must use getElementById()
with an ID.
356 Unity Virtual Stick Does Not Return to Center When You Release Your Finger
366 To Limit Column Values to Strings in a String List Using sqlalchemy
353 I have saved several codes written in python to a visual studio file.
356 I want to create an array of sequences from "1" to a specified number.
345 Who developed the "avformat-59.dll" that comes with FFmpeg?
© 2023 OneMinuteCode. All rights reserved.