jquery - 使用selector来查找href

时间:2015-10-20 18:39:21

标签: javascript jquery html

背景资料:

我试图在属性" row_id"中找到值。在一个href。触发此逻辑的是当用户点击"保存更改"按钮/图像。

问题说明

我现在拥有的jquery代码是返回第二个单元格的内容而不是其中包含href的内容。所以从下面的HTML示例代码中,我需要从

中提取21586
 "<a href="index.php?page=row&amp;row_id=21586">Row SAA:HH1</a>"

HTML代码

触发jquery逻辑的按钮位于行的第4个单元格中,row_id位于第5个单元格的href中。

 <tr>
    <td id="21581">
        <img src="?module=chrome&amp;uri=pix/tango-user-trash-16x16-gray.png" title="1 rack(s) here" height="16" width="16" border="0">
    </td>
    <td><div id="location_name">SAA:HH-123</div></td>
    <td><div id="row_name">SAA:HH1</div></td>
    <td>
         <input tabindex="1" name="edit" class="edit" src="?module=chrome&amp;uri=pix/pencil-icon.png" id="21581" title="Edit row" type="image" border="0">&nbsp;
         <input tabindex="1" style="display: none;" name="submit" class="icon" src="?module=chrome&amp;uri=pix/tango-document-save-16x16.png" title="Save changes" type="image" border="0">
   </td>
   <td>
        <a href="index.php?page=row&amp;row_id=21586">Row SAA:HH1</a>
   </td>
 </tr>

Jquery代码

    //save button handler
    $(".icon").click(function(e){
            //find the <a href that has the row id embbeded in it
            var row_id = $(this).parent().siblings().children($('a[href$="row_id"]'));
            console.log($(row_id).text());
    });

任何建议将不胜感激。

4 个答案:

答案 0 :(得分:0)

你可以试试这个:

http://jsfiddle.net/vsLy0rfx/

$(".icon").click(function(e){
        //find the <a href that has the row id embbeded in it
        var row_link = $(this).parent().siblings().find('a[href*="row_id"]')
        var row_id = row_link.attr('href').split('row_id=')[1];
        console.log(row_id);
});

答案 1 :(得分:0)

检查控制台,它返回21586。 我使用.closest().find()导航并找到相应行中的<a>。然后我获得href属性并将其拆分以找到所需的id

&#13;
&#13;
$(document).ready(function() {
    $('.icon').on('click', function() {
    	var href = $(this).closest('tr').find('a').attr('href');
        var id = href.split('&')[1].split('=')[1];
        console.log(id);
    });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr>
        <td id="21581">
            <img src="?module=chrome&amp;uri=pix/tango-user-trash-16x16-gray.png" title="1 rack(s) here" height="16" width="16" border="0"/>
        </td>
        <td><div id="location_name">SAA:HH-123</div></td>
        <td><div id="row_name">SAA:HH1</div></td>
        <td>
            <input tabindex="1" name="edit" class="edit" src="?module=chrome&amp;uri=pix/pencil-icon.png" id="21581" title="Edit row" type="image" border="0"/>&nbsp;
            <input tabindex="1" style="" name="submit" class="icon" src="?module=chrome&amp;uri=pix/tango-document-save-16x16.png" title="Save changes" type="image" border="0"/>
        </td>
        <td>
            <a href="index.php?page=row&amp;row_id=21586">Row SAA:HH1</a>
        </td>
    </tr>
</table>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

尝试使用以下

var result = $('a[href]',$(this).parent().parent()).attr('href').split("=").pop();

//结果将等于21586

答案 3 :(得分:0)

试试这个。可以普遍用于任何网址和参数值。

$.getUrlParamValue = function(link, parameter){
    var results = new RegExp('[\?&]' + parameter + '=([^&#]*)').exec(link);
    return results[1] || 0;
}

var value  = $.getUrlParamValue ($("a").attr("href"),'row_id');
alert(value);

http://jsfiddle.net/r2xsse9v/