简体   繁体   English

使用jQuery添加mailto:

[英]Add mailto: with jQuery?

<table id="here" border="1">
    <tr><td>London</td><td>london@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Manchester</td><td>manchester@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Liverpool</td><td>liverpool@us.uk</td><td>aaa</td><td>aaa</td></tr>
    <tr><td>Ipswich</td><td>ipswich@us.uk</td><td>aaa</td><td>aaa</td></tr>
</table>

Is possible add link mailto: for second columns with email addresses with jQuery (not modify HTML)? 是否可以添加链接mailto:对于带有jQuery的电子邮件地址的第二列(不是修改HTML)? If yes, how? 如果有,怎么样?

http://jsfiddle.net/zwsMD/1/ http://jsfiddle.net/zwsMD/1/

You could just replace the contents of each second td with an a element with a mailto: href: http://jsfiddle.net/zwsMD/5/ . 你可以用一个带有mailto: href: http//jsfiddle.net/zwsMD/5/ a元素替换每个第二个td的内容。

​$("#here td:nth-child(2)").each(function() {
    var email = $(this).text();

    // replace contents
    $(this).html(
        $("<a>").attr("href", "mailto:" + email).text(email)
    );
});​​​​​​​​​​​​​​​​​​​​

You could do something like this 你可以这样做

​$('td:nth-child(2)').each(function(){
   var text = $(this).text();
    var href = "mailto:"+text;
    var $a = $('<a>', { href: href, text: text});
    $(this).text('').append($a);
});​​​​​​​​​​​​​​​​​​​​

fiddle here http://jsfiddle.net/zwsMD/6/ 在这里摆弄http://jsfiddle.net/zwsMD/6/

Assuming it's always the second td of each row, you could iterate over those elements and wrap the contents in an a element: 假设它始终是每行的第二个td ,您可以迭代这些元素并将contents wrapa元素中:

$("#here td:nth-child(2)").each(function() {
    $(this).contents().wrap("<a href='mailto:" + $(this).text() + "'>");
});​

Here's a working example . 这是一个有效的例子

You will need to loop around every row, find the cell you want and wrap a link around the content. 您将需要遍历每一行,找到您想要的单元格并在内容周围环绕一个链接。 You can use wrapInner for this. 你可以使用wrapInner

$("#here tr").each(function() {
    var td = $(this).children().eq(1);
    var email = "mailto:" + td.text();
    td.wrapInner($("<a>").prop("href", email));
});​

Live example 实例

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

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