我是 Javascript 的新手(但到目前为止我很喜欢它!)并且我正在处理一个非常基本的小项目。一个组件要求我选择字符,然后单击一个按钮并用突出显示的字符刷新屏幕。我使用 Jquery 获得了突出显示功能,但我想知道刷新组件。解决这个问题的最佳方法是什么?
编辑:我想我应该提供更多细节。这个字符列表可能很长。比如几百个或更多。同样在有人点击并突出显示字符后,当他们点击提交时需要发生两件事。一是需要通知数据库哪些字符被突出显示并保持计数(这就是我用唯一 ID 标记每个跨度的原因),二是屏幕需要刷新,仅突出显示的字符随机排列。
所以我认为我正在寻找一种将这些突出显示的字符捕获到 JSON 数组中的方法。然后我可以将信息转发到服务器,对其进行处理,然后重新加载屏幕,并将新的(较小的)列表打乱。这个过程可能会重复。
这是否有助于为设计决策提供信息?我不确定如何使用 java 脚本来捕获突出显示的字符。
<HTML>
<HEAD>
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
<style type="text/css">
span.highlight {background-color: #FFFF00;}
</style>
<script type="text/javascript">
$(document).ready(function() {
$("body").on("click",".letter", function () {
var $this = $(this);
$this.addClass("highlight");
});
});
</script>
</HEAD>
<BODY>
<span class="letter" id="A">A</span>
<span class="letter" id="B">B</span>
<span class="letter" id="C">C</span>
<span class="letter" id="D">D</span>
<span class="letter" id="E">E</span>
<span class="letter" id="F">F</span>
<span class="letter" id="G">G</span>
<span class="letter" id="H">H</span>
<span class="letter" id="I">I</span>
<span class="letter" id="J">J</span>
<span class="letter" id="K">K</span>
<span class="letter" id="L">L</span>
<span class="letter" id="M">M</span>
<span class="letter" id="N">N</span>
<span class="letter" id="O">O</span>
<span class="letter" id="P">P</span>
<span class="letter" id="Q">Q</span>
<span class="letter" id="R">R</span>
<span class="letter" id="S">S</span>
<span class="letter" id="T">T</span>
<span class="letter" id="U">U</span>
<span class="letter" id="V">V</span>
<span class="letter" id="W">W</span>
<span class="letter" id="X">X</span>
<span class="letter" id="Y">Y</span>
<span class="letter" id="Z">Z</span>
<input type="button" onclick="Reduce()" value="Remove Non Highlighted Chars">
</BODY>
</HTML>