简体   繁体   中英

Get Element with Mootools css selector for same element with same id

I have a table which has several links in td tag with the same id,can I get the link's inner html respectively.I want to know

  1. Why cant I add events with all the same elements with same id as $$('#update_room_link') but class selector as $$('.update_room_link') works
  2. 2.How to get the innerhtml for respective links. Same id but different innerhtml upon clicking links, heres the jsfiddle

the is what I want -

<table>
    <tr>
        <td> <a href="javascript:void(0)" class="update_room_link">Edit</a>

        </td>
        <td> <a href="javascript:void(0)" class="update_room_link">Delete</a>

        </td>
        <td> <a href="javascript:void(0)" class="update_room_link">Add</a>

        </td>
    </tr>
</table>

javascript tried as

$$('#update_room_link').addEvent('click', function () {
    alert();// get innerHtml of Edit,Delete or Add as clicked

})

Questions updated
I have a html SELECT in a table row,this row has many table data.I want to get the value/innerhtml of a table data which has its id set (and within the SAME row).Or how can I get an immediate grand-parent of a child FROM a child..is it possible

<tr> 
<td id="id">100</td> 
<td>Australi</td> 
<td>BAT</td> 
<td>2014-02-23</td> 
<td>pending</td> 
</tr>

在此输入图像描述

I want the innerhtml of name of the SELECTED option. All the select has same class name.

The ID must be unique in a html element, that's why you can not use the same ids on your a tags so $$('#update_room_link') is for all elements.

You can use the class and can get inner html like this

$$('.update_room_link').addEvent('click', function () {
    alert(this.innerHTML); //here you will get the respective inner HTML
})

DEMO

Please see ID shold be unique

If you want use id then it should be unique, in that case you will have to attach each function independntly, which is not good practice, like

$$('#update_room_link1').addEvent('click', function () {....
$$('#update_room_link2').addEvent('click', function () {....

I add this answer after you already accepted a answer, just to complete a bit.

If you want to add event to one element by ID you can use

$('update_room_link').addEvent('click', function () {

it will also work with

$$('#update_room_link').addEvent('click', function () {

To add events to many elements, by CLASS you can use

$$('.update_room_link').addEvent('click', function () {

To get the HTML the recommended method by MooTools is

element.get('html'); 

but will also work with

element.innerHTML

since mootools uses native elements

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM