显示"标题"从下拉菜单选项中标记

时间:2016-03-16 09:29:29

标签: javascript jquery html css

<form name="currency select" title="Currency Selector">
    <select name="currency" style="background: #2D3A47; no-repeat left center; cursor: pointer; width: 49px; height: 29px; onchange="window.document.location.href=this.options[this.selectedIndex].value;" value="GO">
        <option value="" disabled="disabled" selected="selected" none="">$ € £</option> 
        <option value="/session/currency/usd/" title="US Dollar">USD</option>
        <option value="/session/currency/eur/" title="EURO">EUR</option>

我正在使用上面的代码。可以从下拉菜单中显示所选选项的title标记吗?现在,当我将鼠标悬停在下拉菜单中的选项上时,标题会弹出,但我想在选择该特定货币后,在单独的文本区域中显示此标题。我怎样才能做到这一点?

2 个答案:

答案 0 :(得分:0)

只需从所选选项中选择attr标题,然后用它填充文本区域。假设您的文本区域是带有id文本区域的div。你可以这样做:

$('div#text-area').text($('.select').attr('title'));

就是这样。

答案 1 :(得分:0)

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<form name="currency select" title="Currency Selector">
    <select name="currency" id="currencyList" value="GO">
        <option value="" disabled="disabled" selected="selected" none="">$ € £</option> 
        <option value="/session/currency/usd/" title="US Dollar">USD</option>
        <option value="/session/currency/eur/" title="EURO">EUR</option>
    </select>

    <textarea id="showTitle"></textarea>

</form>
</body>
<script>
$(document).ready(function()
{
    $(document).on('change','#currencyList',function()
    {
       var result = $("option:selected",this).attr('title');
       $("#showTitle").text(result);
    });
});
</script>