Javascript：更改文本取決於選擇值

Question

我已經爲每個javascript添加了一個元素和文本。有了這個代碼：

$(document).ready(function() { 
    if ($('welcome_page').length) { 
    $('#my_element').after('<tr><td><td><td id="welcome_message">Welcome to my page</td></td></td</tr>'); 
    } 
}); 

我需要能夠將文本>可喜的變化，以我的<頁取決於在頁面設置語言：

<select id="languages" onchange="submit();"> 
<option value="1" selected="">English</option> 
<option value="2">Spanish</option> 
<option value="3">French</option> 
</select> 

我已經試過這一點，但它不這樣的伎倆：

function langChoice(sel){ 
    var langChange = document.getElementById('languages'); 
    var langOption = document.getElementById('welcome_message'); 
     if (sel.options[sel.selectedIndex].value == "1") { 
     langOption.innerHTML = "Enter price per month"; 
     } 
     else if (sel.options[sel.selectedIndex].value == "2") { 
     langOption.innerHTML = "Enter price per week"; 
     } 
     else if (sel.options[sel.selectedIndex].value == "3") { 
     langOption.innerHTML = "Enter price per day"; 
     } 
     else if (sel.options[sel.selectedIndex].value == "4") { 
     langOption.innerHTML = "Enter for sale hour"; 
     } 

} 

Answer 1

我猜...

訪問此JsFiddle

HTML：

個

<div id="greet"></div> 
<select id="languages"> 
    <option value="en" >English</option> 
    <option value="es" selected>Spanish</option> 
    <option value="fr">French</option> 
</select> 

JS：

var welcome = { 
    en:"English", 
    es:"Espanol", 
    fr:"Francais" 
} 
$(document).ready(function() { 
    $('#greet').html(welcome[$('#languages').val()]); 
}); 

$('#languages').change(function() { 
    $('#greet').html(welcome[$('#languages').val()]); 
}); 

Answer 2

也許..

$(document).ready(function() { 
    if ($('welcome_page').length) { 
    $('#my_element').after('<tr><td><td><td id="welcome_message">Welcome to my page</td></td></td</tr>'); 

    langChoice($("#languages")) 

    } 
}); 

我想下拉菜單＃語言出現在頁面中;我不是undestand $（「welcome_page」）..也許$（「＃welcome_page」）或者你使用一個標籤？

Answer 3

OK，然後做一件事打電話給你的提交（）函數

的第一線。例如裏面的功能langChoice（SEL）： -

function submit() { 
    langChoice($("#languages")); 

    .. your logic .. 
} 

Answer 4

如果我理解正確：

<div id="welcome_page"> 
    <select id="languages" onchange="submit();"> 
     <option value="1" selected="">English</option> 
     <option value="2">Spanish</option> 
     <option value="3">French</option> 
    </select> 
    <div id="my_element"></div> 
</div> 

$(document).ready(function() { 

    if ($('#welcome_page').length) { 
     $('#my_element').after('<tr><td><td><td id="welcome_message">Welcome to my page</td></td></td</tr>'); 
    } 

$("#languages").on("change",function(){ 
    var Val = $(this).val(); 

    if(Val==1){ 
     $("#welcome_message").html("English"); 
    } 
    else if(Val==2){ 
     $("#welcome_message").html("Spanish"); 
    } 
    else if(Val==3){ 
     $("#welcome_message").html("French"); 
    } 

}); 


}); 

小提琴：http://jsfiddle.net/tufce1yo/