javascript - 选择选择框选项时显示变量

Question

例如选择框

<select>
  <option selected="" value="">Please Select</option>
  <option value='txt'>Text</option>
  <option value='int'>Numbers</option>
  <option value='bool' >Boolean</option>
</select>

有一个字符串

$messageList=array ( 'txt'=>'text message', 'int'=>'int message',
                     'bool'=>'bool message');

我想要实现的是在选择选项时显示相应的消息？

Answer 1

我不知道 php，但首先我认为您需要使用json_encode将 php 数组转换为 javascript 对象。http://php.net/manual/en/function.json-encode.php

<?php
   $messageList=array ( 'txt'=>'text message', 'int'=>'int message','bool'=>'bool message');

   echo var msgs = json_encode($messageList);
?>

然后在javascript中，

$('select').change (function () { 
    alert(msgs[$(this).val()]);
});

你还需要一个class/id选择。因为当您更改页面中任何选择框的选项时，将触发上述代码。

Answer 2

假设您发布的数组是一个 JavaScript 对象（似乎您使用的是 PHP 的关联数组表示法）：

​var sel = document.getElementsByTagName('select')[0],
    $messageList= {
    'txt' : 'text message',
    'int' : 'int message',
    'bool' : 'bool message'
    };

sel.onchange = function(){
    var selected = this.value;
    alert($messageList[selected]);
};​​

JS 小提琴演示。

Answer 3

如果你想用 jQuery 做到这一点：

$messageList= { 'txt':'text message', 'int':'int message','bool':'bool message' };

$('#choices').change( function() { alert( $messageList[ $(this).val() ] ); } );​

JFiddle在这里：

http://jsfiddle.net/yCHqy/