Question

我想知道在动态显示的html内容中存储的正确方法是什么。

我的情况是，根据点击的内容，某些文本会显示在网站的其他部分。我的第一个想法是在js / jquery脚本中创建一个变量来存储这个内容，以便脚本可以在必要时访问它。

这是一个例子：

var someContent=" Content to be displayed when something is clicked";
var a=$('#myid');

a.click(function(){
    $('#myOtherId').text(someContent);      
    });

但是过了一段时间后，我想到内容应该存储在html中，显示值设置为“无”＆＃39;和js脚本应该简单地切换它的可见性，这取决于它是否被点击。

将内容存储在js脚本中似乎要容易得多 - 但有些东西告诉我有更好的方法可以做到这一点......

Answer 1

实际上，你可以通过在HTML元素中包含文本来实现它，并使用jQuery的.toggle或.show，具体取决于你希望它如何响应第二次点击：

$("#toggle").click(function () {
    $('#msg').toggle(); // or .show() to have it in one way only
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="msg" style="display:none">Content to be displayed when something is clicked</span>
<br>
<button id="toggle">click me</button>

当内容是静态的时，将它嵌入HTML中似乎更自然，而当内容是动态的（即它取决于应用程序的实际状态）时，您将注入文本的动态部分JavaScript的。

对于开发团队中的非JS程序员（但具有HTML知识），理论上在将消息嵌入页面的HTML部分时更容易操作消息。

但这确实是一个意见问题。

以下是两者的混合：

$("#enter").click(function () {
    // Copy the number into the error message
    $('#num').text($("#inp").val());
    // Show the error message when the number is not even
    $('#msg').toggle($('#inp').val() % 2 !== 0);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Enter an even number: <input id="inp" type="number" value=1>
<button id="enter">Verify</button>

<div id="msg" style="display:none; color:red">
    The number <span id="num"></span> is not even
</div>

如何存储动态显示的内容

1 个答案: