suchen

Heim >Web-Frontend >js-Tutorial >jQuery implementiert die Methode zum Anzeigen des Textes im Textfeld, nachdem der Mausklick auf die Webseite erfolgt

jQuery implementiert die Methode zum Anzeigen des Textes im Textfeld, nachdem der Mausklick auf die Webseite erfolgt

PHPz
PHPzOriginal
2016-05-16 16:00:471605Durchsuche

In diesem Artikel wird hauptsächlich die Methode von jQuery zum Anzeigen von Text im Textfeld nach dem Mausklick auf die Webseite vorgestellt. Durch Klicken mit der Maus auf den Text kann der Effekt erzielt werden, dass der entsprechende Text im Textfeld unter dem Häkchen angezeigt wird oben. Es handelt sich um jQuery-Mausereignisse und Freunde, die relevante Kenntnisse zu Kettenoperationen benötigen, können sich auf 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="js/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<ul>
<li>张三</li>
<li>李四</li>
<li>王五</li>
<li>赵六</li>
</ul>
<table width="200" border="1" cellspacing="0" cellpadding="0">
 <tr>
  <td>选择</td>
  <td>姓名</td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
 <tr>
  <td><input type="checkbox" name="checkbox" value="1" /></td>
  <td><input type="text" name="username" value="" /></td>
 </tr>
</table>
<script>
$("ul li").click(function(){
var text = $(this).text();
$("input").val("");
$("input:checked").parents("td").siblings("td").children("input").val(text);
})
</script>
</body>
</html>

[Verwandte Tutorials empfohlen]

1 beziehen. JavaScript-Video-Tutorial
2. JavaScript-Online-Handbuch
3. Bootstrap-Tutorial

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Verwenden Sie JS, um QQ-Space-Kommentar-Antworteffekte perfekt zu implementierenNächster Artikel：Verwenden Sie JS, um QQ-Space-Kommentar-Antworteffekte perfekt zu implementieren

In Verbindung stehende Artikel

Mehr sehen