Question

我用JQuery创建了这个函数：http://jsfiddle.net/3uqF2/8/

此功能的目的是重命名或以其他方式将文本更改为另一个tekst。正如你在链接中看到的那样，函数有效，但后来我把它放在我的桌子上，我使用“Foreach”句子，并且函数仅适用于第一行???对于其他行，它将两个div放在一起（参见我的链接），并且函数不起作用。

这是我在ASP.NET（MVC）中的代码

<table>
    <tr>
       <th>
         <a id="LINK1" href="#">Eng</a> /
         <a id="LINK2" href="#">Slo</a>
       </th> 
    </tr>
@foreach (var row in Model.Spremenljivke)
{
    <tr align="center">
        <td>
            <div id="lnk1">@String.Join("", ...)</div> //i did not put all code, it is too long
            <div id="lnk2">@String.Join("", ...)</div>
        </td>
    </tr>
 ...
}

知道为什么它只适用于第一行吗？

Answer 1

ID必须是唯一的，请使用类来代替：

@foreach (var row in Model.Spremenljivke)
{
    <tr align="center">
        <td>
            <div class="lnk1">@String.Join("", ...)</div> //i did not put all code, it is too long
            <div class="lnk2">@String.Join("", ...)</div>
        </td>
    </tr>
 ...
}

并在jquery中：

 $("#LINK1").click(function () {
        $(".lnk2").hide()
        $(".lnk1").show()
    });

FIDDLE EXAMPLE

Answer 2

目前，循环中的每次迭代都会创建2个具有重复ID的div。也许你可以做更多的事情：

@foreach (var row in Model.Spremenljivke)
{
    <tr align="center">
        <td>
            <div class="my-link" data-id="lnk1">@String.Join("", ...)</div>
            <div class="my-link" data-id="lnk2">@String.Join("", ...)</div>
        </td>
    </tr>
 ...
}

然后您的链接（因为您可以看到您的div data属性链接到具有相同class的链接）：

<div class="status lnk1">Testiranje</div>
<div class="status lnk2">Testing</div>

最后你的jquery：

$(document).ready(function () { // <-- you don't need multiple of those (1 is ok)
    $(".my-link").on("click", function() { 
        $(".status").hide();
        var linkId = $(this).data("id");
        $("." + linkId).show();
    });
});

这是fiddle

我在JQuery中的重命名功能在Foreach句子中不起作用？

2 个答案: