js下拉onchange_js 動態創建select 並賦予onchange事件

『壹』 javascript中select的onchange事件獲取當前選項的值

當前值是：

『貳』怎麼樣用js通過onchange用下拉獲取一張圖片

不太明白你的意思，我試著理解回答。內
例如：
<img id="img1" src="" />
<select onchange="document.getElementById('img1').src=this.value">
<option value="1.jpg">第一個容圖片</option>
</select>

『叄』怎麼用js中的onchange中的下拉獲取一個圖片

嗯，我是這樣理解你的意思的，也不知道對不對，就是當下拉菜單發生變化的時候，根據這個下拉菜單所選擇的值，去獲取對應的圖片。

我這是我寫的DEMO,你可以仿著再改造一下：

HTML:

<!DOCTYPEhtml>
<html>

<head>
	<title>Test4</title>
	<metahttp-equiv="Content-type"content="text/html;charset=utf-8"/>
</head>

<body>
<!--onchange事件，調用函數，傳入的this就是select這個對象本身-->
<!--傳入this，我們就可以直接對其進行操作和訪問了-->
<!--另外，option的value我這里設置成了圖片的路徑，這樣當選擇發生變化時，就知道圖片的src，我就可以添加圖片了-->
	<selectonchange="fSel(this)">
		<optionvalue='../picture/01.jpg'>西瓜</option>
		<optionvalue='../picture/02.jpg'>哈密瓜</option>
		<optionvalue='../picture/03.jpg'>水蜜桃</option>
	</select>
</body>
<scripttype="text/javascript">

	functionfSel(obj){
		varsrc=obj.value;//獲取下拉菜單的選項值
		varimg=document.createElement('img');//然後我就創建一個圖片對象
		img.src=src;//並傳給圖片對象src，這個圖片就有值了，就可以去引用圖片路徑了
		document.body.appendChild(img);//然後將其添加到網頁中
		//當然，你可以根據你的思路做其它動作，或者是這樣，下拉菜單中的option的value值你也不必設成圖片的src,可以設置成1、2、3、4，然後得到這個值後，再去選擇對應的圖片，比如說，有一張圖片ID=2，那麼，當下拉菜單的值為2時，我就去獲取類似「../picture/」+ID＋「.jpg」這樣的一個字元串，得到圖片的src，再去獲取或是設置網頁上的圖片src。這樣就實現你的目的了
	}

</script>
</html>

『肆』關於js的onchange方法。

javascript onchange()事件：javascript onchange()事件一般用於用戶表單中，例如：當文本框內容發生改變時觸發的事件，或者下拉列表框內容發生改變時觸發的事件等。

示例分享：onchange()事件，用戶輸入時，將小寫字母轉換為大寫。

此處用到了javascript中的一個方法 toUpperCase(); //將小寫母轉換為大寫字母。

<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8"/>
<title>用戶表單驗證</title>
<script>
functionchangeValue(){
varuserName=document.getElementById("userName");//通過Id獲得對象userName;

userName.value=userName.value.toUpperCase();//將對象的值進行大小寫的轉換賦值給當前對象的值；

}
</script>
</head>
<body>
<formname="myform"method="POST"action="register.php"onsubmit="returncheckForm();">
userName:<inputtype="text"name="userName"value=""id="userName"onchange="changeValue();"/><br/>
<inputtype="submit"name=""value="用戶注冊"/>
</form>
</body>
</html>

『伍』怎樣用js設置select下拉框的當前值是onchange後獲得的值

你直接在onchange事件里引入其他方法就可以啊內
<select .... onchange="a();" />
<script>
function a(){
//邏輯容
....
b();
}
function b(){
//邏輯
....
}
</script>

『陸』下拉框onchange

<form name="frm" method="post">
<select name="aa" onChange="oc(this.options[this.selectedIndex].value);">
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
</select>
</form>
<script>
function oc(v){
alert(v);
alert(document.frm.aa.options.selectedIndex); //當前選擇項的索引值,從0開始遞增，沒選中專時為-1。屬
}
</script>

『柒』 select中onchange的用法

用法：onchange 事件會在域的內容改變時發生。

onchange="SomeJavaScriptCode"

onChange事件只有在值改變時才可觸發，所以必須在每一次選擇時（尤其第一次）保證選擇的值是改變的！

onmousedown 單擊一次就查詢一次，所以每選擇一次就查詢一次，增加了資料庫的負擔。每次選擇至少要查詢兩次（一次是在資料庫載入數據，一次是選擇選項時又觸發一次，）

咧：

<select name="expireDay" id="expireDay" class="form-control"

onchange="searchChange(this.options[this.options.selectedIndex].value);">

<option

<c:if test="${'0' == expireRemind.searchType}">

selected

</c:if>

value="0">aa</option>

<option

<c:if test="${'1' == expireRemind.searchType}">

selected

</c:if>

value="1">bb</option>

</select>

可以顯示和隱藏

function searchChange(obj){

if(obj=="0"){

$('#expireDate').hide();

$('#soonExpireDay').show();
}

if(obj=='1'){

$('#soonExpireDay').hide();

$('#expireDate').show();
}
}

(7)js下拉onchange擴展閱讀

通常JavaScript腳本是通過嵌入在HTML中來實現自身的功能的。

是一種解釋性腳本語言（代碼不進行預編譯）。

主要用來向HTML（標准通用標記語言下的一個應用）頁面添加交互行為。

可以直接嵌入HTML頁面，但寫成單獨的js文件有利於結構和行為的分離。

跨平台特性，在絕大多數瀏覽器的支持下，可以在多種平台下運行（如Windows、Linux、Mac、Android、iOS等）。

Javascript腳本語言同其他語言一樣，有它自身的基本數據類型，表達式和算術運算符及程序的基本程序框架。Javascript提供了四種基本的數據類型和兩種特殊數據類型用來處理數據和文字。而變數提供存放信息的地方，表達式則可以完成較復雜的信息處理。

『捌』 js給下拉框的value或selectedIndex賦值，不觸發onchange事件嗎

可以，但是不知道你把onchange時間加在什麼地方了

上面的版代碼時候這樣的

</select>

如果要加權onchange事件，是這樣的$("#style").change(function(){console.log("123")})

『玖』 js 動態創建select 並賦予onchange事件

mySelect.addEventListener('change',function(){
return mychange.apply(this,[this.value,pid,num]);
});

推薦你幾個鏈專接屬
http://developer.mozilla.org/en/Core_JavaScript_1.5_Guide
http://ejohn.org/
http://quirksmode.org/

導航:首頁 > 編程語言 > js下拉onchange

js下拉onchange

與js下拉onchange相關的資料

友情鏈接