2011-06-16 29 views
1

我已经看到了几个SO帖子,这显然与我的问题有关,但他们似乎都没有做我想做的事情。我可以使用JQuery代码模拟超链接的点击吗?

我有一个嵌套的结构,以显示在报告层次(业务单元和品牌):

<tr class="BrandRow1"> 
    <td> 

    </td> 
</tr> 
<tr class='BrandRow1 StoreRow1'> 
... 
</tr> 
<tr class='BrandRow1 StoreRow2'> 
... 
</tr> 

这个布局中我使用A标记来显示/隐藏“孩子”的内容(通过使用。的class属性

上的负载,我想告诉所有的“节点”如果$('.StoreRow2').length小于说4

我用一个函数来做到的触发:

// Allow an item to toggle other items' visibility 
$(".VisibilityToggle").click(function() { 
    var ControlledClass = findClass($(this), "Toggles-"); 
    if (ControlledClass != "") { 
     $("." + ControlledClass).toggle(); 
     var Text = $(this).attr("rel"); 
     if (Text != "") $(this).attr("rel", $(this).attr("rev")).attr("rev", Text).text(Text); 
    } 
    return false; 
}); 

我想要做的就是通过从JS代码调用这个触发'切换'打开。

我以为像'$(“。VisibilityToggle”)。click()`会做我想要的东西,但这似乎并没有在我的代码工作,但确实如果我通过JS手动调用它控制台在Chrome中。我怀疑它与我的代码在事件绑定到页面之前正在运行。

您能否协助?

感谢您的阅读。

E.g.标记

... 
<tr class='BrandRow TRBrand_2'> 
    <td class="Level0"> 
     <p> 
      <a id="DesktopApp0_ctl00_rptReportBrand_ctl01_A_Brand" rel="-" rev="+" class="button toggleButton SummaryToggle VisibilityToggle Toggles-BrandId_2">+</a> &nbsp;<strong>Brand2</strong> 
     </p> 
    </td> 
    <td> 
     <p> 
      34</p> 
    </td> 
    <td> 
     <p> 
      21</p> 
    </td> 
    <td> 
     <p> 
      22</p> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      0.0&#37;</p> 
    </td> 
    <td> 
     <p> 
      1 
     </p> 
    </td> 
    <td> 
     <p> 
      34.0 
     </p> 
    </td> 
</tr> 
<tr class='SiteRow BrandId_2 TRStore_10'> 
    <td class="Level1"> 
     <p> 
      <a id="DesktopApp0_ctl00_rptReportBrand_ctl01_rptSites_ctl00_A_Site" rel="-" rev="+" class="button toggleButton SummaryToggle VisibilityToggle Toggles-TRSiteUser_10">+</a>&nbsp; <span class="Bold">BrandX - Store 10</span> 
     </p> 
    </td> 
    <td> 
     <p> 
      14</p> 
    </td> 
    <td> 
     <p> 
      9</p> 
    </td> 
    <td> 
     <p> 
      8</p> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      0.0&#37;</p> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      0.0 
     </p> 
    </td> 
</tr> 
<tr class='UserRow TRStoreUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Clarke Kent 
     </p> 
    </td> 
    <td> 
     <p> 
      3</p> 
    </td> 
    <td> 
     <p> 
      3</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_3">1</span><span class=" d5_3">2</span><span class=" d5_3">3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Alexie Sayle 
     </p> 
    </td> 
    <td> 
     <p> 
      2</p> 
    </td> 
    <td> 
     <p> 
      2</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_2">1</span><span class=" d5_2">2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Anders Bottom 
     </p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_1">1</span><span>2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Daniella Ecclescake 
     </p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_1">1</span><span>2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Mark E Smith 
     </p> 
    </td> 
    <td> 
     <p> 
      2</p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_1">1</span><span>2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Matthew Bannister 
     </p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td> 
     <p> 
      1</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span class=" d5_1">1</span><span>2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
<tr class='UserRow TRSiteUser_10'> 
    <td class="Level2"> 
     <p> 
      <img src="/img/icons/spacer.png" alt=" " /> 
      &nbsp;Raj Patel 
     </p> 
    </td> 
    <td> 
     <p> 
      3</p> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td colspan="3" class="Drive5Graphic"> 
     <span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span class=" plus">+</span> 
    </td> 
    <td> 
     <p> 
      0</p> 
    </td> 
    <td> 
     <p> 
      &#8734;</p> 
    </td> 
</tr> 
... 
+0

是的,你可以。 $(linkObject).click() – reporter 2011-06-16 11:30:57

+0

正如我在我的问题中提到的,.click()在我的页面中不起作用。我认为它是在事件被绑定之前调用它的东西(我已经把我的调用放在$(document).ready(...);;中的.trigger/.click),因为如果我通过调用函数Chrome中的JS控制台,它的工作原理与您所说的完全相同。百思不得其解。 – 5arx 2011-06-16 11:36:43

+1

我不知道.ABrand是,请给更多的标记 – ridcully 2011-06-16 11:41:58

回答

4

你可以使用触发器:

$(".ABrand").trigger('click'); 

是你想达到什么样的?

+0

它是,它通过JS控制台工作,但不是如果我把$(document).ready(...)中的调用;请参阅我对原始问题的修订。 – 5arx 2011-06-16 11:42:45

+0

也许你在实际绑定click()事件之前调用.trigger('click')?那么命令.trigger('click')根本就不会被识别。 – ub1k 2011-06-16 12:48:30

+0

尝试将触发器置于setTimeout中,并检查是否可以正常工作:http://www.w3schools.com/js/js_timing.asp – ub1k 2011-06-16 14:52:32

1

你的语法没有问题:click()会触发单击元素。

$('.ABrand').click(); 

更多标记要求正确回答你的问题,我会想,但如果你担心的事情没有得到及时迷上了看看live()delegate(),可外面document.ready使用。

$(".VisibilityToggle").live("click", function() { ... }); 

$("#Container").delegate(".VisibilityToggle", click", function() { ... }); 
+0

visibilityillogling工程罚款通过实际点击,如果我手动调用它在JS控制台。所以我想它与在$(document).ready(...)运行点处未绑定的事件有关...?我试过把它放在$(document).load(...)但是没有骰子:-( – 5arx 2011-06-16 12:13:37

0

如果您遇到问题定时绑定事件(即.click(function(){}))和事件触发(即.click()),为什么不干脆链上的两个在一起吗?

$('.ABrand').click(function() { 
    // do 3 flips, 5 somersaults and a pirouette 
}).click(); 

这样一来,你肯定点击触发条件获取点击绑定后调用。

相关问题