php和javascript用selectedIndex多選項顯示在頁面上

阿新 • • 發佈：2021-02-01

<html>
<head>
<meta http-equiv="content-type" content="text/html charset=uft-8"/>
<title></title>
</head>
<body>
<form method="post" action="" id="form1">
<table width="300" 
 border="0" cellpadding="0" cellspacing="0">
<tr>
	<td height="30" align="center" valign="middle">請選擇你喜歡的php類圖書</td>
</tr>
<tr>
	<td align="center" valign="middle"><select name="select[]" 
 size="5" multiple onchange="change()">
		<option value="PHP程式開發範例寶典" >PHP程式開發範例寶典</option>
		<option value="PHP5從入門到精通">PHP5從入門到精通</option>
		<option value="PHP函式參考大全">PHP函式參考大全</option>
	</select>
</tr> 

<tr>
	<td height="30" align="center" valign="middle" ><input type="submit" name="submit" value="提交"></td>
</tr>
</table>
</form>
<p id="p1"></p>
<?php   //用php輸出選中項的值
if($_POST['submit']=="提交"){
	echo "你選擇的意見主題為：";
	foreach($_POST['select'] as $value)
	echo $value."\n\n";
}
?>
<script>

function change(){
	var form=document.forms[0];
	var sel=form.elements['select[]'];
	sel.options[sel.selectedIndex].selected=true;　　//設定選中項
	var selectedOptions=getSelectedOptions(sel);
	var message="";
	for(var i=0,len=selectedOptions.length;i<len;i++){　　//出現選中項的索引、文字、和值
		message+="selected index:"+selectedOptions[i].index+"\nselected text:"+selectedOptions[i].text+"\nselected value:"+selectedOptions[i].value+"\n\n";
}

var p=document.getElementById('p1');
p.innerHTML=message;
}
function getSelectedOptions(selectbox){　　//用for迴圈來選取被點中設定了selected的項，再壓縮到陣列中再返回
	var result=new Array();
	var option=null;
	for(var i=0,len=selectbox.options.length;i<len;i++){
		option=selectbox.options[i];
		if(option.selected){
			result.push(option);
		}
	}
	return result;
}

</script>
</body>
</html>

php和javascript用selectedIndex多選項顯示在頁面上

技術標籤：php學習筆記phpjsjavascript <html> <head> <meta http-equiv="content-type" content="text/html charset=uft-8"/>

PHP和javascript區別

PHP和javascript區別 1.使用範圍 PHP既可以寫服務端語言，又可以寫在HTML頁面中，寫前端頁面和互動

【PHP例項】用PHP實現XML的生成和解析

技術標籤：php功能例項phpphp後端 php操作xml可以有多種方式如domdocment，simplexml,xmlwriter等其中最簡單的應該是simplexml了，這次就來說說simplexml怎麼讀取和解析xml檔案或字串。

vue滑鼠停留下拉框選項顯示懸浮資訊，CSS兩列多行

技術標籤：前端javascriptcssvue.jshtml 這個功能是在下拉框選項裡做的，下拉框的id要自己修改，滑鼠懸浮在選項框裡的選項，右側出現一個資訊框，資訊框裡的內容是兩列 HTML內容這裡是用的下拉框，因此要把懸浮框

網路程式設計之IO複用機制(多路IO轉接)之使用管道驗證epoll的LT和ET07

技術標籤：Linux網路程式設計網路epollsocket 1 阻塞與非阻塞，LT與ET概念 1）我們知道，檔案描述符(例如管道，套接字等等)具有阻塞與非阻塞，例如套接字，當我們使用read去讀取內容時，由於套接字預設是阻塞的，

用callable介面和runnable介面實現多執行緒同步下載圖片

//執行緒建立方式三：實現callable介面/*callable的好處1、可以定義返回值2、可以丟擲異常 */public class TestCallable implements Callable<Boolean> {private String url;//網路圖片地址private String na

解決YYLabel多行顯示不全時結尾無法以省略號顯示的問題

使用YYLabel的最大好處就是能非同步繪製最大程度保持介面流暢，可是預設情況下卻在文字超出規定行數時卻無法以省略號的樣式展示。

Android自定義View之RadioGroup實現跨多行顯示

本文例項為大家分享了Android RadioGroup跨多行顯示的具體程式碼，供大家參考，具體內容如下

Android RadioGroup多行顯示效果解決單選問題

導語如下圖所示，這是一個導航選擇彈框。進行單項選擇，然後會監聽回撥選擇的事件。問題是Android的RadioButton是一般是放在RadioGroup中進行管理的，而RadioGroup又是線性佈局，即單行有效，多行無效。如圖那種就需

java web用servlet監聽器實現顯示線上人數

本文例項為大家分享了java web用servlet監聽器實現顯示線上人數，供大家參考，具體內容如下

用JS實現選項卡

本文例項為大家分享了JS實現選項卡的具體程式碼，供大家參考，具體內容如下

javascript用defineProperty實現簡單的雙向繫結方法

defineProperty Object提供的方法，用於給物件新增自定義屬性具體用法如下： const obj = { _value: 1 };

python和JavaScript哪個容易上手

Python Python 是對於第一次程式設計的人來說是最為流行的程式語言之一，而且這不是巧合。Python 是一門通用的程式語言。這意味著它能應用在廣泛的程式設計任務上。幾乎沒有你不能用 Python 完成的工作。這一點使得很

win10如何快速實現多屏顯示？win10系統啟用分屏功能的方法

win10內建有分屏功能，使用分屏功能可以讓多個網頁或者任務同時在一個視窗下顯示，能夠使我們提高工作效率。但是很多使用者們不清楚要怎麼樣才能設定？其實，啟用分屏功能非常的簡單，同時按下【Win】+【A】快捷鍵即

win10將螢幕分成四塊實現多屏顯示的方法

一般情況下，win10系統電腦連線顯示器，螢幕只會顯示一整個網頁內容。為此，win10給大螢幕使用者推出了一個很好的功能，就是視窗分屏，能夠將螢幕分成四塊，使用這個功能可以一邊聊qq 一邊看視訊一邊上網等，那麼win

用while多次呼叫一個方法

public static boolean download(String url, String api_key, String sign,List<BasicNameValuePair> parameList, RenameDownload rename) throws InterruptedException, IOException {boolean flag = down(u

Java+Selenium做UI自動化中@FindBy和@CacheLookup用法【多測師_王sir】

一、@FindBy和@CacheLookup用法程式碼例項 package page; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement;

php laravel左連線leftJoin多條where語句

通常情況下我們在做leftjoin連線時需要對不止一個條件進行進行匹配，這時候就需要使用閉包方式，如下：

sqlserver 動態sql執行execute和sp_executesql,用動態SQL語句給變數賦值

sp_executesql的運用　　書寫語法要點:　　exec sp_executesql @sql,N’引數1 型別1,引數2 型別2,引數3 型別3 OUTPUT’,引數1,引數2,引數3 OUTPUT;　　注意引數前後順序必須對應好如下圖不同顏色的標記

vue和animate動畫庫實現選項卡

本文引入animate動畫庫，使選項卡切換更好看，靈活使用vue的api animate動畫庫官網地址：https://animate.style/

php和javascript用selectedIndex多選項顯示在頁面上

相關推薦