Heim  >  Artikel  >  Web-Frontend  >  So verbergen Sie mehr als einen Teil in JQuery

So verbergen Sie mehr als einen Teil in JQuery

青灯夜游
青灯夜游Original
2022-06-10 14:57:471797Durchsuche

In jquery können Sie über die Methode css() einen Überlaufstil zu einem Element hinzufügen, um den überschüssigen Teil auszublenden. Die Syntax lautet „$(„angegebenes Element“).css(„overflow“, „hidden“);“ . Die Methode css() kann ein oder mehrere Stilattribute für das angegebene Element festlegen; das Überlaufattribut wird verwendet, um die Verarbeitungsmethode festzulegen, wenn der Inhalt das Elementfeld überläuft. Wenn der Attributwert auf „versteckt“ gesetzt ist, wird der überschüssige Teil ( Überlaufinhalt) kann gekürzt und ausgeblendet werden.

So verbergen Sie mehr als einen Teil in JQuery

Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.6.0-Version, Dell G3-Computer.

In jquery können Sie einem Element über die Methode css() einen Überlaufstil hinzufügen, um den überschüssigen Teil auszublenden. Die Methode

css() kann ein oder mehrere Stilattribute des übereinstimmenden Elements festlegen. Wenn Sie diese Methode verwenden, um den Stil „overflow:hidden;“ für ein Element festzulegen, kann der überschüssige Teil ausgeblendet werden.

Syntaxformat:

$("指定元素").css("overflow","hidden");

Das Überlaufattribut kann das Hinzufügen von Bildlaufleisten im entsprechenden Elementbereich steuern, wenn der Inhalt die Elementbox überläuft. Dies wird verwendet, um die Verarbeitungsmethode festzulegen, wenn der Inhalt die Elementbox überläuft.

  • Wenn der Wert dieses Attributs auf „versteckt“ gesetzt ist, kann der überschüssige Teil (Überlaufinhalt) abgeschnitten und ausgeblendet werden.

Implementierungscode:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("div").css("overflow","hidden");
				});
			});
		</script>
		<style>
			div {
				background-color: #eee;
				width: 200px;
				height: 100px;
				border: 1px dotted black;
				overflow: visible;
			}
		</style>
	</head>
	<body>

		<div>
			<p>这里的文本内容会溢出元素框。</p>
			<p>这里的文本内容会溢出元素框。</p>
			<p>这里的文本内容会溢出元素框。</p>
		</div>
		<br><br><br><br><br>
		<button>隐藏多个td元素</button>
	</body>
</html>

So verbergen Sie mehr als einen Teil in JQuery

[Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Front-End-Video]

Das obige ist der detaillierte Inhalt vonSo verbergen Sie mehr als einen Teil in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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