Question

我有5X5文本框，每隔几秒随机更改一次。我想出了如何让盒子可以选择。现在我希望能够在我点击时检索出现在框内的字母。我是编码的新手，但经过研究，我认为我可以将.click函数与.text（）函数结合起来。我添加了一个

标签并尝试在其中打印单击的字母。它不起作用。我正在使用.text（）函数错误吗？我以前没用过，所以我不确定。

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>LetterTouch</title>
</head>

  <link rel = "stylesheet" type="text/css" href="gameboard.css">
  <!-- <link href="scripts/jquery-ui-1.10.4.custom.css" rel="stylesheet" type="text/css"/>-->
  <script type="text/javascript" src="scripts/jquery-1.10.2.js"></script>
  <script type="text/javascript" src="scripts/jquery-ui-1.10.4.custom.js"></script>

  <script type="text/javascript">

  $("document").ready(function() {
                $("#squares").selectable();

      });

      var nIntervId;

var letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

function changeLetters() {
    nIntervId = setInterval(boardGen, 1500);
}

function boardGen() {
    $('li').each(function (i, e) {
        $(e).text(letters.charAt(Math.floor(Math.random() * letters.length)));
    })
}




$( "li" ).click(function() {
    $( this ).text();
    $( "p" ).html(  );
        });

changeLetters();

 </script>

<body>



<ol id="squares">
  <li class="A1"></li>
  <li class="A2"></li>
  <li class="A3"></li>
  <li class="A4"></li>
  <li class="A5"></li>
  <li class="B1"></li>
  <li class="B2"></li>
  <li class="B3"></li>
  <li class="B4"></li>
  <li class="B5"></li>
  <li class="C1"></li>
  <li class="C2"></li>
  <li class="C3"></li>
  <li class="C4"></li>
  <li class="C5"></li>
  <li class="D1"></li>
  <li class="D2"></li>
  <li class="D3"></li>
  <li class="D4"></li>
  <li class="D5"></li>

  <p> H </p> 

</body>
</html>

Answer 1

这可能是你要做的http://jsfiddle.net/jogesh_pi/X24s9/

$("document").ready(function() {

  $("#squares").selectable();


  $( "#squares" ).on('click', 'li', function() {
    var txt = $( this ).text();
    $("p").html(txt);
  });

});

Answer 2

只需传递单击的li元素的文本，因为html（）函数的参数将代表p标记运行。

尝试，

$("#squares li").click(function() {
    $("p").html($(this).text());
});

而且您的HTML似乎无效，请尝试关闭<ol>代码

Answer 3

只需使用.text（）属性。

 $("p").html($(this).text());

Answer 4

由于您要在li中插入字符，因此您需要使用.text（）来获取它们。

e.g。

$( "li" ).click(function() {
    $( "p" ).html($(this).text());
});

这样做是因为我获取了li的html内容 - 由$（this）.text（）引用，并将其指定为p元素的内容。 .html（）的工作原理是在其中放置一个字符串参数将其分配给其html内容。

单击后检索元素/文本

4 个答案: