您还没有展示您尝试过的任何内容,这可以通过多种方式完成。仅显示我创建的一个小片段,其余的研究和编码取决于您。
jQuery(function() {
$('.hash').click(function() {
$('.price').html("€8.39");
$('.price2').html("€10.06");
});
});
jQuery(function() {
$('.percent').click(function() {
$('.price').html("£7.45");
$('.price2').html("£8.93");
});
});
div.price {
width: 100px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
div.price2 {
width: 100px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="price">$10</div>
<div class="price2">$12</div>
<button class="hash">Euro</button>
<button class="percent">Pound</button>
没有您的代码,我无法编写正确的解决方案,但查看您给出的示例,我建议使用 HTML DOM insideHTML 属性。我将在这里留下文档的链接,其中有完美的解释。 文档链接
使用innerHTML,您将能够随时动态更改特定元素的内容。希望这对您有帮助!
我编写了一些代码片段。告诉我这是否是您想要的(带有表格或 div)。
function doFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed!";
}
<!DOCTYPE html>
<html>
<body>
<input id="clickMe" type="button" value="clickme" onclick="doFunction();" />
<p id="demo">Click me to change my HTML content (innerHTML).</p>
</body>
</html>
jQuery(function() {
$('.hash').click(function() {
$('.price').html("€8.39");
$('.price2').html("€10.06");
});
});
jQuery(function() {
$('.percent').click(function() {
$('.price').html("£7.45");
$('.price2').html("£8.93");
});
});
div.price {
width: 100px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
div.price2 {
width: 100px;
height: 100px;
border: 1px solid black;
padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="price">$10</div>
<div class="price2">$12</div>
<button class="hash">Euro</button>
<button class="percent">Pound</button>