带原型的第N个子选择器
Nth-child Selector with Prototype
我正在尝试将"第n个子（n）"与Prototype一起使用，就像使用jQuery一样。下面是一个代码示例。。。
function myFunction()
{
$$('div.amfinder-horizontal td:nth-child(1) select').simulate('click');
$$('div.amfinder-horizontal td:nth-child(1) select').simulate('change');
}
Event.observe(window,"load",myFunction);
不幸的是，这似乎并没有选择元素（因为点击和更改不起作用）。当我把select的类放在那里时，它确实有效。。。但我不能使用这个课程，需要通过第n个孩子来完成。我相信：第一个和：最后一个有效，但我总共有6个需要这样做。。即便如此，也不一定都是6个人。
如果有人能提供一个第n个孩子的例子，以及它如何与Prototype一起工作，那就太好了！
<div class="amfinder-horizontal" id="amfinder_529e1406aff23Container">
<table>
<tbody>
<tr>
<td>
<div class="dropdown-title">Year</div>
<div class="dropdown-element active">
<select name="finder[424]" id="finder-72--424" style="width: 101px;" class="active">
<option value="0">
Year
</option>
<option value="8736830">
2013
</option>
<option value="8734482">
2012
</option>
<option value="8734488">
2011
</option>
<option value="8734487">
2010
</option>
<option value="8734481">
2009
</option>
<option value="8734486">
2008
</option>
<option value="8734485">
2007
</option>
<option value="8734484">
2006
</option>
<option value="8734494">
2005
</option>
<option value="8734483">
2004
</option>
<option value="8734489">
2003
</option>
<option value="8734492">
2002
</option>
<option value="8734491">
2001
</option>
<option value="8734490">
2000
</option>
<option value="8734493">
1999
</option>
<option value="8734496">
1998
</option>
<option value="8734495">
1997
</option>
<option value="8734501">
1996
</option>
<option value="8734500">
1995
</option>
<option value="8734499">
1994
</option>
<option value="8734498">
1993
</option>
<option value="8734497">
1992
</option>
<option value="8734503">
1991
</option>
<option value="8734502">
1990
</option>
<option value="8734504">
1989
</option>
<option value="8734505">
1988
</option>
<option value="8734508">
1987
</option>
<option value="8734507">
1986
</option>
<option value="8734506">
1985
</option>
<option value="0">Year</option>
</select>
<span class="arrow"></span>
</div>
</td>
<td>
<div class="dropdown-title">Make</div>
<div class="dropdown-element">
<select name="finder[425]" id="finder-72--425" disabled="disabled" style="width:120px">
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
<option value="0">Make</option>
</select>
<span class="arrow"></span>
</div>
</td>
<td>
<div class="dropdown-title">Model</div>
<div class="dropdown-element">
<select name="finder[426]" id="finder-72--426" disabled="disabled" style="width:120px">
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
<option value="0">Model</option>
</select>
<span class="arrow"></span>
</div>
</td>
<td>
<div class="dropdown-title">Sub Model</div>
<div class="dropdown-element">
<select name="finder[427]" id="finder-72--427" disabled="disabled" style="width:120px">
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
<option value="0">Sub Model</option>
</select>
<span class="arrow"></span>
</div>
</td>
<td>
<div class="dropdown-title">Engine</div>
<div class="dropdown-element">
<select name="finder[428]" id="finder-72--428" disabled="disabled" style="width:120px">
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
<option value="0">Engine</option>
</select>
<span class="arrow"></span>
</div>
</td>
<td>
<div class="dropdown-title">Position</div>
<div class="dropdown-element">
<select name="finder[429]" id="finder-72--429" disabled="disabled" style="width:120px">
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
<option value="0">Position</option>
</select>
<span class="arrow"></span>
</div>
</td>
</tr>
<tr>
<td colspan="6">
<br>
<div class="amfinder-buttons" style="display:none">
<button id="findbtn" class="btn" title="Find" type="submit"><span><span>Find</span></span></button>
<button class="btn" name="reset" value="1" title="Reset" type="submit"><span><span>Reset</span></span></button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
$$()是CSS选择器方法，它返回元素的数组
$$('div.amfinder-horizontal td:nth-child(1) select').simulate('click');
将不起作用，因为您无法在阵列上运行模拟
只要你有Event.simulate加载的，这就应该有效
$$('div.amfinder-horizontal td:nth-child(1) select').invoke('simulate','click');
您已使用$两次。
也许，这是你问题的原因。
更改
$$('div.amfinder-horizontal td:nth-child(1) select').simulate('click');
$$('div.amfinder-horizontal td:nth-child(1) select').simulate('change');
至
$('div.amfinder-horizontal td:nth-child(1) select').simulate('click');
$('div.amfinder-horizontal td:nth-child(1) select').simulate('change');
您可以在数组样式中选择它们
http://jsbin.com/eDAWaji/1/edit
html:
<ol class="myclass">
<li>lista</li>
<li>lista</li>
<li>lista</li>
<li>lista</li>
<li>lista</li>
</ol>
js:
var li = $$('body > ol.myclass li');
li[3].style.background = 'red';
相关文章：
- Windows8应用程序(html&Javascript）:从图片库(除了文件选择器）显示图像的另一种方式
- 在动态创建的元素上获取对特定选择器的引用
- AngularJS-在JSON选择器中使用变量名
- 每当您在选择器内移动鼠标时，悬停功能就会重复
- 使用CSS或js，使用动态选择器选择任意li的下一个元素
- jQuery最近父级的数据属性选择器
- 为什么不'在JQuery中找到第二个css选择器的工作
- 为什么 .focus(） 不起作用，而 .css(“color”，“red”） 在同一个选择器上起作用
- jquery IE7中的第n个选择器
- Webdriver.io pageObject模式-通过传递参数来定义元素选择器
- jquery日期选择器年份范围默认值
- 原型中漂亮的代码，如何省略'不是函数'空结果选择器上的错误
- 带原型的第N个子选择器
- 多个带有原型的 CSS 选择器
- 对此选择器进行原型设计
- 选择器原型等库中的“这个”问题
- 在原型中使用CSS选择器触发点击事件
- 原型Js多重选择器
- 原型集属性是否适用于元素类选择器
- document.getElementsByClassName breaking jQuery 类选择器由原型覆盖引起
