$("iframe").each(function() {
var src= $(this).attr('src');
$(this).attr('src',src);
});
var src= $(this).attr('src');
$(this).attr('src',src);
});
- 11月 06 週二 201810:33
[Jquery]停止所有youtube播放(iframe embed)
- 4月 02 週一 201816:47
[Jquery]讓html檔也能使用include方法
<div id="top"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$("#top").load( "top.html");
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$("#top").load( "top.html");
</script>
- 1月 03 週三 201815:36
使用Jquery讓你的iframe也能RWD(嵌入youtube專用)
<script>
// Find all iframes
var $iframes = $("iframe" );
// Find & save the aspect ratio for all iframes
$iframes.each(function () {
$( this ).data( "ratio", this.height / this.width )
// Remove the hardcoded width & height attributes
.removeAttr( "width" )
.removeAttr( "height" );
});
// Resize the iframes when the window is resized
$( window ).resize( function () {
$iframes.each( function() {
// Get the parent container's width
var width = $( this ).parent().width();
$( this ).width( width )
.height( width * $( this ).data( "ratio" ) );
});
// Resize to fix all iframes on page load.
}).resize();
</script>
// Find all iframes
var $iframes = $("iframe" );
// Find & save the aspect ratio for all iframes
$iframes.each(function () {
$( this ).data( "ratio", this.height / this.width )
// Remove the hardcoded width & height attributes
.removeAttr( "width" )
.removeAttr( "height" );
});
// Resize the iframes when the window is resized
$( window ).resize( function () {
$iframes.each( function() {
// Get the parent container's width
var width = $( this ).parent().width();
$( this ).width( width )
.height( width * $( this ).data( "ratio" ) );
});
// Resize to fix all iframes on page load.
}).resize();
</script>
- 12月 22 週五 201711:40
[JQuery][屬性] 使用removeAttr() 方法從被選元素中移除屬性
用法
$("#元素").removeAttr('屬性值');
例：
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").removeAttr("style");
});
});
</script>
- 12月 22 週五 201711:12
[JQuery][屬性] 使用.prop() 取得或設置 checked 、selected、readonly 、disabled 屬性
例：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>prop demo</title>
<style>
p {
margin: 20px 0 0;
}
b {
color: blue;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<input id="check1" type="checkbox" checked="checked">
<label for="check1">Check me</label>
<p></p>
<script>
$( "input" ).change(function() {
var $input = $( this );
$( "p" ).html(
".attr( \"checked\" ): <b>" + $input.attr( "checked" ) + "</b><br>" +
".prop( \"checked\" ): <b>" + $input.prop( "checked" ) + "</b><br>" +
".is( \":checked\" ): <b>" + $input.is( ":checked" ) + "</b>" );
}).change();
</script>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>prop demo</title>
<style>
p {
margin: 20px 0 0;
}
b {
color: blue;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<input id="check1" type="checkbox" checked="checked">
<label for="check1">Check me</label>
<p></p>
<script>
$( "input" ).change(function() {
var $input = $( this );
$( "p" ).html(
".attr( \"checked\" ): <b>" + $input.attr( "checked" ) + "</b><br>" +
".prop( \"checked\" ): <b>" + $input.prop( "checked" ) + "</b><br>" +
".is( \":checked\" ): <b>" + $input.is( ":checked" ) + "</b>" );
}).change();
</script>
</body>
</html>
- 12月 22 週五 201710:47
[JQuery][屬性] html()法方 - 設定被選中元素的內容 (inner HTML)
例：返回被選中元素的內容
$("元素").html()
例：設定一個值，並覆蓋被選中元素的所有內容
$(元素).html(內容)
$("元素").html()
例：設定一個值，並覆蓋被選中元素的所有內容
$(元素).html(內容)
- 12月 21 週四 201714:37
[JQuery][屬性] 使用 hasClass() 檢查被選元素是否包含指定的 class
檢查第一個段落是否擁class等於"intro"
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert($("p:first").hasClass("intro")); //顯示true
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert($("p:first").hasClass("intro")); //顯示true
});
});
</script>
- 12月 20 週三 201710:16
[JQuery][屬性] 使用 attr() 方法操作屬性(變更值、取得屬性值、多重屬性變更)
1.變更屬性值
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("img").attr("width","180"); //變更屬性值
});
});
</script>
- 12月 19 週二 201714:28
[JQuery][屬性] addClass 將指定的css class添加到元素集中的每個元素
一次可以添加一個以上的css class，由一個空格分隔，以匹配元素的集合，如下所示：
$("p").addClass( "myClass yourClass" );
這種方法通常用於.removeClass()將元素的類從一個切換到另一個，如下所示：
- 11月 01 週三 201716:37
[JQuery]按下div區塊，連結出去
jQuery('#id').on('click', function(){
window.location='網址';
});
window.location='網址';
});
其它分類 (8)