Question

社区，我有一个选择下拉列表，试图将两个变量传递给javascript。第一个变量是（source_id），第二个变量是（source_flag）。

我的选择如下所示......

<select id="ticket_source" name="ticket_source" onchange="showEmail(this)">
<option value="">Select Source</option>

我使用查询来填充剩余的选项。

$get_sources = mysql_query("select source_id, source_name, source_flag from ticket_source order by source_name ASC");
while(($source_list = mysql_fetch_assoc($get_sources)))
{
    echo '<option value="'.$source_list['source_id'].'" data-flag="'.$source_list['source_flag'].'">'.$source_list['source_name'].'</option>
}

<option value="0">Other</option>
</select>';

我的javascript会显示隐藏的div。我正在尝试获取存储在data-flag属性中的值，我不太确定是否有某种路由可以做到这一点。

function showEmail(element)
{
    var id = element.value;
    var divTwo = document.getElementById("ticket_source");
    var flag = divTwo.getAttribute('data-flag');
    alert(flag);
    // Do something with flag...
    var div = document.getElementById("received");
    if(id == 2 || id == 3 || id == 5)
    {
        div.style.display = 'block';
    }
    else
   {
       div.style.display = 'none';
   }
}

Answer 1

纯javascript中的这个怎么样

var flag =document.getElementById('ticket_source').options[select.selectedIndex].data-flag;

或

var flag =element.options[element.selectedIndex].data-flag;
var flag =element.options[element.selectedIndex].getAttribute('data-flag');

See Fiddle Here

Answer 2

试试这个：

var flag = document.querySelector('#ticket_source').dataset.flag; // using javascript
var flag = $('#ticket_source').data('flag'); // using jquery

JSBIN链接：http://jsbin.com/ujiday/228/

Answer 3

在现代浏览器中，您可以这样做

document.getElementById('myThing').dataset.flag

但是，这不适用于非HTML5兼容的浏览器，因此您需要像在上面的代码中一样使用getAttribute。

或者如果你使用jQuery，Mohit Pandey的回答会很好。

编辑：看看你的代码，看起来你也试图从选择框中提取数据值，而在你的PHP中你将它添加到选项中，这可以解释为什么它返回null /未定义。

做一个小提琴（使用jQuery） http://jsfiddle.net/QAsgN/

如何获得data-flag的值

3 个答案: