0

私はこのようなhtmlを持っています:ulにはli要素がほとんどなく、削除ボタンがあり、

質問: CheckMark Image 記号で正しい li 要素を表示する必要があります。

ShowCheckMarkLi(Descriptions,Client) を呼び出しているとしましょう

次に、CheckmarkImage.Ico を使用して UL 要素に 2 つの li のみを表示する必要があります。他は削除する必要があります。

htmlはこのようなものです:-

   <ul>
            <li id="liRightDescriptions">
                <span>
                    <span>Descriptions</span>
                    <img class="removeImg" src="../Images/RemoveButton.ico" /></span>
            </li>
            <li id="liRightSpecialization">
                <span><span>Specialization</span><img style="display: none;" class="removeImg" src="../Images/RemoveButton.ico" /></span>
            </li>
            <li id="liRightOrgChart">
                <span>Org Chart</span><img style="display: none;" class="removeImg" src="../Images/RemoveButton.ico" />
            </li>
            <li id="liRightClient"><span>
                <span>Client</span>
                <img style="display: none;" class="removeImg" src="../Images/RemoveButton.ico" /></span></li>
            <li id="liRightAchievements"><span>
                <span>Achievements</span>
                <img class="removeImg" src="../Images/RemoveButton.ico" /></span></li>
            <li id="liRightMemberships"><span>
                <span>Memberships</span>
                <img class="removeImg" src="../Images/RemoveButton.ico" /></span></li>
            <li id="liRightGetRatings"><span>
                <span>Get Ratings</span>
                <img class="removeImg" src="../Images/RemoveButton.ico" /></span></li>
            <li id="liRightSkills"><span>
                <span>Skills</span>
                <img class="removeImg" src="../Images/RemoveButton.ico" /></span></li>
        </ul>

私はこのようにしようとしています:

    function ShowRightCheckMarkButton(Descriptions, Skills, Client, Achievements, Memberships, OrgChart, Specialization,GetRatings) {
            $('.divright').css("visibility", "visible");
            $('#listProjectRelated').empty();
            if (Achievements) {
                $('#listProjectRelated').append("<li id='liRightAchievements'><span><span>Achievements</span><img class='checkImg' src='../Images/Checkmark.ico'/></span></li>")
            }
            else
            {
                $('#listProjectRelated').append("<li id='liRightAchievements'><span><span>Achievements</span><img class='removeImg' src='../Images/RemoveButton.ico'/></span></li>")
            }
.
.
.
.
.
.

    }
4

3 に答える 3

0

関数は、次の行で id 'listProjectRelated' を参照します。

$('#listProjectRelated').empty();

これは ul 要素の ID である必要がありますか? したがって、html の最初の行は次のようになります。

<ul id="listProjectRelated">
于 2013-02-27T14:01:59.953 に答える
0

ここに解決策があります。目的の関数を記述する方法に関する問題の 1 つは、変数名を渡すことです。これらは文字列を意図していると思います。

疑似コードでは、あなたが達成しようとしているのは（私が思うに）です：

  1. すべてのリスをつかみます。
  2. それらのそれぞれについて、そのテキストが引数 ('Client'、'Descriptions') のいずれかと一致するかどうかを確認します。
  3. その場合は、li の画像を変更して、言及したアイコンを表示します (画像が表示されていることを確認します)。
  4. そうでない場合は、リストから li を削除します。

呼び出したい関数のコードは次のようになります。

function ShowCheckMarkLi(){
    // Get all the lis
    var lis = document.getElementsByTagName('li');

    // Loop through them...
    for(var i = 0, l = lis.length; i < l; ++i){
        // And, for each, loop through the arguments
        for(var j = 0, m = arguments.length; j < m; ++j){
            // If the argument string is found in the li's text...
            if(lis[i].innerText.match(arguments[j])){
                // ...Find the image
                var img = lis[i].getElementsByTagName('img')[0]
                // ...Change its src attribute to replace all the text after the last slash with your filename
                img.src.replace(/[^\/]+$/, 'CheckmarkImage.Ico');
                // ...And make sure it's displayed.
                img.style.display = 'inline-block';
            }
            // Otherwise...
            else {
                // ...Remove it!
                lis[i].parentNode.removeChild(lis[i]);
            }
        }
    }
}

// Call your function with strings
ShowCheckMarkLi('Descriptions','Client');
于 2013-02-27T14:03:16.883 に答える
0

デモ: http://jsfiddle.net/8YXDJ/ 

    function ShowLi(val) {
        $("#_ul li").css('display','none');
        $(val).each(function() { 
            var t = String(this);
            $("#_ul li span").filter(function() {
                return (jQuery.trim($(this).text()) == t);
            }).parent().css('display','');
        });
    }
ShowLi([ "Descriptions","Specialization","Skills" ])
于 2013-02-28T05:29:13.857 に答える