1

我是 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>
4

1 回答 1

1

如果您只想刷新屏幕:

$( "span.letter:not(.highlight)" ).fadeOut();

如果你真的想重新加载页面,你可以把可见的字母放在你的 url 的哈希中。哈希是后面的部分#,您可以使用window.location.hash. 对于这样的 URL,http://yoururl.com/letters/highlight#abc它会产生#abc. 然后,刷新将有效地重定向到具有不同哈希参数的相同 URL。

于 2013-09-07T21:26:10.187 回答