2

たくさんのメニュードロップダウンを複数の要素に変換しようとしています。ページにドロップダウンが1つしかない場合にこれを行うことができましたが、他のドロップダウンを追加すると、スクリプトが各メニューを複数回実行するように見えます。私はJavascript/Jqueryを初めて使用しますが、親要素への入力のみにする方法があるかどうか疑問に思っていました。

これが、単一のドロップダウンで機能する現在のスクリプトです。

$('.mylinks li').each(function() {
  var inputClass = $('.mylinks .link').html().toLowerCase();
  $('body').prepend('<select class="'+inputClass+'" onchange="window.location.href=this.options[this.selectedIndex].value"></select>');
  $('a').each(function() {

    var linkName = $(this).html();
    var linkVal = $(this).attr('href');
    $('select').append('<option value="'+linkVal+'">'+linkName+'</option>');
  
  });
});

HTML

<div class="mylinks">
  <ul>
    <li>
        <a href="#">Drop 1</a>
        <a href="http://geartrade.com">Link 1</a>
        <a href="http://geartrade.com">Link 2</a>
        <a href="http://geartrade.com">Link 3</a>
    </li>
    <li>
        <a href="#">Drop 2</a>
        <a href="http://geartrade.com">Link 1</a>
        <a href="http://geartrade.com">Link 2</a>
        <a href="http://geartrade.com">Link 3</a>
    </li>
  </ul> 
 </div>

このエラーの例もここにあります：http：//jsfiddle.net/UdTcF/

4

2 に答える 2

3

このコードを試すことができます：

$(document).ready(function () {

    $('.mylinks li').each(function () {
        var inputClass = $('.mylinks a').html().toLowerCase();
        var select = $('<select class="' + inputClass + '" onchange="window.location.href=this.options[this.selectedIndex].value"></select>');
        $('body').prepend(select);
        $(this).find('a').each(function () {
            var linkName = $(this).html();
            var linkVal = $(this).attr('href');
            select.append('<option value="' + linkVal + '">' + linkName + '</option>');
        });
    });

});

変数selectを使用して、追加するを保存します。後で、を使用してこの変数<select>に追加できます。<option>select.append()

そして、$(this).find('a')代わりにを使用して、すべてではありませんが特定の$('a')を検索します。<a><li><a>

これがjsfiddleです。

于 2013-03-14T02:34:39.383 に答える
0

ここ：

$('a').each,

すべての要素を選択しています。現在のliにあるものだけを選択したいと思います。したがって、addを置き換えるだけです。

$('a',this).each,

これの子である要素、たとえばli要素のみが選択されます。

于 2013-03-14T02:53:33.770 に答える