首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > JAVA > Java Web开发 >

HTML里如何调用JS代码?

2011-11-21 
HTML里怎么调用JS代码??要求是这样的,如下图:左Select框右Select框AAddCBDelEDsubmit左Select里本来是ABCD

HTML里怎么调用JS代码??
要求是这样的,如下图:
左Select框 右Select框  
  A Add C
  B Del E
  D
  submit
左Select里本来是ABCDE,当选择CE时,点Add,它们就会跑到右边去,再选C后点Del,C又会跑左边去.点击submit时,要求得到右Select框里的所有值;
代码如下:但是我不知道点submit时如何得到右边的值:(另提一问,就是怎么能让PHP得到它的值)
<script> 
function copyToList(from,to) //from表示:包含可选择项目的select对象名字 to表示:列出可选择项目的select对象名字 //你可以根据你的具体情况修改 

  fromList = eval('document.forms[0].' + from); 
  toList = eval('document.forms[0].' + to); 
  if (toList.options.length > 0 && toList.options[0].value == 'temp') 
  { 
  toList.options.length = 0; 
  } 
  var sel = false; 
  for (i=0;i <fromList.options.length;i++) 
  { 
  var current = fromList.options[i]; 
  if (current.selected) 
  { 
  sel = true; 
  if (current.value == 'temp') 
  { 
  alert ('你不能选择这个项目!'); 
  return; 
  } 
  txt = current.text; 
  val = current.value; 
  toList.options[toList.length] = new Option(txt,val); 
  fromList.options[i] = null; 
  i--; 
  } 
  } 
  if (!sel) alert ('你还没有选择任何项目'); 


function getValue() //这个函数可以得到值,但是不知道怎么调用啊

alert(document.form1.text1.value); 
var sel = document.form1.chosen; 
var temp=""; 
for(i=0; i <sel.options.length; i++) 

temp += sel.options[i].value; 
temp += sel.options[i].text+" | |"; 

alert(temp);
}
 
</script> 

<form action="index.php" name="myForm" method="post" onsubmit="alert(document.myForm.choice.value)"> 
  <table class="listing" border="0" cellspacing="0" cellpadding="0" width="780"> 
<tr class="detailrow <?php echo ($_rc = 1 - $_rc)?>"> 
  <td align=left valign=center height = "80"> <?php echo "Select CommissionCharge"?>&nbsp;&nbsp; </td> 
  <td> <select name="possible" size="8" align=left multiple style="width: 200px;> 
  <option value="1">yy </option> 
  <option value="2">gz </option> 
  <option value="3">sz </option> 
  <option value="4">wh </option> 
  <option value="5">sh </option> 
  </select> </td> 
  <td>&nbsp;&nbsp; <a href="javascript:copyToList('possible','chosen')">add </a>&nbsp;&nbsp; <BR /> <br /> 
&nbsp;&nbsp; <a href="javascript: copyToList('chosen','possible')">delete </a>&nbsp;&nbsp; </td> 
  <td> <select name="chosen" size="8" align=left multiple style="width: 200px;"> 
  <option value="temp"> </option> 
  </select> </td> 
  </tr> 
  
  <tr> 
  <td align=left> 
  <table border=0 cellspacing=0 cellpadding=5> 
  <tr> 


  <td> 
  <!-- 在这里提交,但是type,value都不能变,为什么在onclick=...这里调用不了呢?-->
  <input class="formbutton" type="submit" value="submit" onclick="getValue();">  
  </td> 
  </tr> 
  </table> 
  </td> 
  </tr> 
  </table>  
</form>

[解决办法]
onclick="getValue();"> 
改成:
onclick="return getValue();">


函数 getValue()在最后添加返回值。
temp += sel.options[i].text+" ¦ ¦"; 

alert(temp); 
return true;//填加返回值


</script> 


另外,alert(document.form1.text1.value); 
中的form1改成form名称-->myForm,
且其中的text1没有定义。删除或者替换成已有的input名称。


[解决办法]
给你的javascript起个名字,如abc.js 然后在</head><body>之间加入
<script type="text/javascript" src="abc.js">

不知楼主要的是否这样?
[解决办法]
下面的代码可以调用getValus()方法了,不明白lz的设计为什么submit还要onclick

HTML code
<script>function copyToList(from,to) //from表示:包含可选择项目的select对象名字 to表示:列出可选择项目的select对象名字 //你可以根据你的具体情况修改{  fromList = eval('document.forms[0].' + from);  toList = eval('document.forms[0].' + to);  if (toList.options.length > 0 && toList.options[0].value == 'temp')  {    toList.options.length = 0;  }  var sel = false;  for (i=0;i <fromList.options.length;i++)  {    var current = fromList.options[i];    if (current.selected)    {      sel = true;      if (current.value == 'temp')      {        alert ('你不能选择这个项目!');        return;      }      txt = current.text;      val = current.value;      toList.options[toList.length] = new Option(txt,val);      fromList.options[i] = null;      i--;    }  }  if (!sel) alert ('你还没有选择任何项目');}function getValue() //这个函数可以得到值,但是不知道怎么调用啊{alert();alert(document.form1.text1.value);var sel = document.form1.chosen;var temp="";for(i=0; i <sel.options.length; i++){temp += sel.options[i].value;temp += sel.options[i].text+" ¦ ¦";}alert(temp);}</script><form action="index.php" name="myForm" method="post" onsubmit="alert(this.possible.value)">  <table class="listing" border="0" cellspacing="0" cellpadding="0" width="780"><tr class="detailrow <?php echo ($_rc = 1 - $_rc)?>">  <td align=left valign=center height = "80"> <?php echo "Select CommissionCharge"?>&nbsp;&nbsp; </td>    <td> <select name="possible" size="8" align=left multiple style="width: 200px;">      <option value="1" selected>yy </option>      <option value="2">gz </option>      <option value="3">sz </option>      <option value="4">wh </option>      <option value="5">sh </option>    </select> </td>    <td>&nbsp;&nbsp; <a href="javascript:copyToList('possible','chosen')">add </a>&nbsp;&nbsp; <BR /> <br />&nbsp;&nbsp; <a href="javascript: copyToList('chosen','possible')">delete </a>&nbsp;&nbsp; </td>    <td> <select name="chosen" size="8" align=left multiple style="width: 200px;">      <option value="temp"> </option>    </select> </td>  </tr>     <tr>            <td align=left>                <table border=0 cellspacing=0 cellpadding=5>                    <tr>                        <td>                            <!-- 在这里提交,但是type,value都不能变,为什么在onclick=...这里调用不了呢?-->                            <input class="formbutton" type="submit" value="submit" onclick="getValue();">                             </td>                    </tr>                </table>            </td>        </tr>  </table> </form> 

热点排行