مسج الجزء الثاني السؤال - مرساة إلى تقليد علامة التبويب الربط انقر فوق الحدث

Question

السؤال

---

1. أود أن يكون مرساة في الصفحة التي يقوم بنفس وظيفة علامة التبويب.
   كنت فقط قادرة على الحصول على عمل إذا أنا وضعت شيئا مثل $('#tabs ul a:first').click() في الحدث onclick خاصة مرساة.ملاحظة:href ليس له أي تأثير على الروابط الخارجية إلى علامة التبويب البرنامج المساعد.وربما تستخدم فقط في المراسي في علامة التبويب عند بناء انقر فوق الحدث.

2. جئت عبر مسج ملزمة المشكلة.
   بدلا من أداء دوم البحث عن كل وصلة سيكون أفضل متجر في متغير الحدث انقر فوق إضافة الخارجية مرساة انقر فوق الحدث.ومع ذلك ، عندما محدد يعود كائنات متعددة ، الكائن في مجموعة (هو على الأرجح لا صفيف عاد ، ولكن كائن) لا يبدو أن لديها أي وظائف.

JSFiddle سبيل المثال

JS

---

$(function() {
    $( "#tabs" ).tabs(); 

    var tabs = $('#tabs ul li a');

    $( "#links2 a" ).each(function(index){
       $(this).bind('click',function(){
          (tabs[index]).click();
       });
    });
});

HTML/CSS (غير مكتملة)

---

<link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css" />
<link rel="stylesheet" href="http://jqueryui.com/demos/demos.css" />
<style type="text/css">
   #links1 , #links2, #links3      { margin-top:1em; font-size:1.5em;}
   #links1 a, #links2 a, #links3 a { text-decoration:none; color:#0cf}
</style>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Foo</a></li>
        <li><a href="#tabs-2">Bar</a></li>
        <li><a href="#tabs-3">Baz</a></li>
    </ul>
    <div id="tabs-1" ><p>Foo foo foo foo foo foo foo foo. foo-foo!</p></div>
    <div id="tabs-2" ><p>Bar bar bar bar bar bar bar bar. bar-bar!</p></div>
    <div id="tabs-3" ><p>Baz baz baz baz baz baz baz baz. baz-baz!</p></div>
</div>

<div id="links1">
   <div>HREF doesn't matter:</div>
   <a href="#tabs-1">foo</a>     
   <a href="#tabs-2">bar</a>           
   <a href="#tabs-3">baz</a>
</div>

<div id="links2">
   <div>Trying to dynamically bind onclick</div>
   <a href="#">foo</a> 
   <a href="#">bar</a>       
   <a href="#">baz</a>
</div>

<div id="links3">
   <div>What should happen, but not the right method:</div>
   <a href="#" onclick="$('#tabs li:first a').click()">foo</a>
   <a href="#" onclick="$('#tabs li a:eq(1)').click()//not sure if this is the best way to reference">bar</a>       
   <a href="#" onclick="$('#tabs li:last a').click()">baz</a>
</div>

Answer 1

بدلا من

(tabs[index]).click();

ينبغي أن يكون

tabs.eq(index).click();

النموذج الأول يحصل لك الخام عنصر DOM ، في حين أن الثاني يحصل لك مسج ملفوفة عنصر DOM.لا يوجد "انقر فوق" طريقة على <a> العقد عنصر على الأقل لا توجد طريقة قياسية.(بدلا من ذلك ، $(tabs[index]) سوف تعمل أيضا.)