社区,我有一个选择下拉列表,它试图将两个变量传递给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';
}
}
在纯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');
在这里看到小提琴
试试这个:
var flag = document.querySelector('#ticket_source').dataset.flag; // using javascript
var flag = $('#ticket_source').data('flag'); // using jquery
JSBIN链接:http://jsbin.com/ujiday/228/
在现代浏览器中,你可以这样做
document.getElementById('myThing').dataset.flag
但是,这在不符合HTML5标准的浏览器中不起作用,因此您希望像在上面的代码中所做的那样使用getAttribute。
或者,如果你使用的是jQuery,Mohit Pandey的答案会很好。
编辑:查看您的代码,看起来您也试图从选择框中提取数据值,而在 PHP 中,您将其添加到选项中,这将解释为什么它返回 null/undefined。
做了一个小提琴(使用jQuery)http://jsfiddle.net/QAsgN/