javascript - 用 Javascript 和链接动态替换内容

Question

http://jsfiddle.net/bUjx7/42/

<script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.js'>
</script>

<script type='text/javascript'>
$(document).ready(function () {
    $('.fieldreplace a').click(function () {
        $('#fieldmatch, .fieldgame').hide();
        var region = $(this).data('region');
        $('#' + region).show();
    });
});
</script>

我正在努力做到这一点，因此单击一个链接将替换所有单元格中的内容，而不是仅替换一个单元格中的内容。

帮助？

Answer 1

你可以代替所有td的s之类的吗？

$('#tableId td').html('content to update on all cells');

Answer 2

您的代码中有几个问题。

1. 我看到你已经指定id="fieldgame1"了很多次，记住id每个元素都应该是唯一的。
2. 您将使用类选择器而不是 id 选择器来选择所有元素。

现在，您将使用不同的类制作单元格内容，并使用类选择器来隐藏/显示它们。

HTML

<div class="fieldmatch" >2-5</div>
<div class="fieldgame1" >1-6</div>
<div class="fieldgame2" >6-1</div>
<div class="fieldgame3" >2-5</div>

CSS

.fieldgame1, .fieldgame2, .fieldgame3 {
    display:none;
}

JavaScript

$(document).ready(function () {
    $('.fieldreplace a').click(function () {
        $('#fieldmatch, .fieldgame').hide();
        var region = $(this).data('region');
        $('#' + region).show();
    });
});

代码示例：http: //jsfiddle.net/bUjx7/44/