مسج تسليط الضوء على رابط عند النقر عليها

Question

كيف يمكنني استخدام مسج لتسليط الضوء على رابط عند النقر على ذلك ؟

على سبيل المثال, عندما اضغط على الرابط class1_1 أنا تريد أن تجعل من هذا الرابط الأحمر (أو لون آخر).

شفرة جافا سكريبت من هنا:

<script type="text/javascript">
 $(function(){
  $("#menu li").each(function(){
     $(this).click(function(event){
       var ul=$(this).children("ul")
       var span = $(this).children("span")
       if(ul.html()!=null)
       {
          if(ul.css("display")=="none")
          {
            ul.css("display","block");
            span.addClass("up")
          }else
          {
            ul.css("display","none")
            span.removeClass("up")
          }
           event.stopPropagation();
       }else
       {
         event.stopPropagation();
       }
     });
  });
  return false;
 });
</script>

الكود هنا:

<ul id="menu">

<li class="title"><span>class1 </span>
<ul>
  <li><a href="">class1_1</a></li>
   <li><a href="">class1_2</a></li>
 </ul>
 </li>
<li class="title"><span>class2</span>
   <ul>
  <li><span>class2_1</span>
   <ul>
    <li><a href="">class2_1_1</a></li>
    <li><a href="">class2_1_1</a></li>
  </ul>
  </li>
 </ul>
</li>
</ul>

ربما لا أستطيع تفسير سؤالي بوضوح ، أعني آخر onclick رابط تجعل

اللون الأحمر و آخر مجموعة روابط إلى هناك اللون الافتراضي

Answer 1

<script type = "text/javascript" >
$(function() {
    $("#menu li").each(function() {
        $(this).click(function(event) {

            $("#menu li").removeClass("high");
            $(this).addClass("high");

            var ul = $(this).children("ul")
            var span = $(this).children("span")
            if (ul.html() != null) {
                if (ul.css("display") == "none") {
                    ul.css("display", "block");
                    span.addClass("up")
                } else {
                    ul.css("display", "none") span.removeClass("up")
                }
                event.stopPropagation();
            } else {
                event.stopPropagation();
            }
        });
    });
    return false;
});
</script>


<style>
.high{color:red}
</style> 

Answer 2

ومن الممكن استخدام CSS، لا مسج المطلوبة:

وتسليط الضوء على:

a:active {
    background-color: #FF0000;
}

وتغيير لون الرابط:

a:active {
    color: #FF0000;
}

وتحرير: ردا على تعليقك ... وإذا صلاتك لا توجيه المتصفح إلى صفحة أخرى، يمكنك استخدام <لأ href = "https://stackoverflow.com/questions/813046/jquery-highlight-the- الارتباط عندما تم النقر عليها / 813083 # 813083 "> مايك روبنسون الجواب لتحقيق نفس التأثير دون مغادرة الصفحة وبدون تغيير لون الخلفية الافتراضي و onblur.

Answer 3

وأعتقد أن هذا ينبغي أن نفعل ذلك، على الرغم من أنني لم يكن لديك مسج على يد في الوقت الحالي. يفترض 'حتى' هي فئة التي تجعل الارتباط الأحمر الخاص بك:

$("ul#menu a").click(function(){
 $(this).addClass('up');
});

Answer 4

هذا يجب أن تعمل:

جافا سكريبت:

$(function(){
    $('.class1').click(function() {
        $(this).toggleClass('active1');
    });
});

CSS:

a.class1 { color: red; }
a.active1 { color: blue; }

HTML:

<a href="#" class="class1">some text</a>

من الأفضل استخدام toggleClass (2 في 1) بدلا من addClass/الإعلانات.

Answer 5

وأود أن أوصي http://plugins.jquery.com/project/color المساعد jquery.color. وسوف تسمح لك لتحريك اللون على كل أنواع العناصر أتش تي أم أل.

Answer 6

وجافا سكريبت:

$('.link').click(function() {
    if (!$(this).hasClass('hi')) {
        // If this link is not already highlighted, highlight it and make
        // sure other links of class .link are not highlighted.
        $('.hi').removeClass('hi');
        $(this).addClass('hi');
    }
});

والمغلق:

a.hi { color: red; }

وأتش تي أم أل:

<a href="#" class="link">my text</a>
<a href="#" class="link">that text</a>
<a href="#" class="link">this text</a>

Answer 7

يمكنك أن تفعل ذلك باستخدام CSS الدرجة الزائفة نشط.وتضيف نمط خاص تنشيط عنصر.

على سبيل المثال يمكنك أن تفعل هذا:

a: active { color: red; }

كن حذرا, a:active يجب أن يأتي بعد:تحوم في تعريف CSS من أجل أن تكون فعالة!!