- ベストアンサー
jqueryで未定のファイル名を取得する
サイトでjquery.1.4.2を使っています。 javascriptないしjqueryで、/img/test01.jpg～test05.jpg、tesuto.jpgがあり、個数が6個ある（または～～というファイルがある）とアラートを返したいのですが、方法が良く分かりません。 jqueryでloadを使う事も考えましたがファイル名が一定ではないのと個数が毎回変わるため指定ができない状況です。 /index.html /js/jquery.js /img/ファイル なお特定のプラグインを使用する場合、jquery側のバージョン変更は可能です。 よろしくご教授ください。
- picicate
- お礼率58% (101/172)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
関連するQ&A
- jQueryにて背景のURLを取得
jQueryにて背景のURLを取得しimgを表示する場合で背景を縦横の倍率を50％に縮小するにはjavascriptをどうすればいいのでしょうか？ 【javascript】 jQuery(function($){ var ori_img = $("#crop_img"); crop_window.css({'background-image': 'url('+ori_img.attr('src')+')'}); }); 【HTML部分】 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <div id="crop"> <img src="./test.jpg" id="crop_img" alt="" > <div id="crop_window"></div> </div>
- ベストアンサー
- AJAX
- jqueryで画像を切り替えたい
以下ソースがあります。 ●main.js $(function(){ jQuery.ajax({ url : "./news.txt", type : "get", success : function(data){ alert(data); } }); }); ●news.txt test と記述しています。 ●index.html <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>jQuery Sample</title> <script type="text/javascript" src="jquery-1.7.1.min.js"></script> <script type="text/javascript" src="main.js"></script> </head> <body> <h1>jQueryサンプル</h1> <p>非同期通信の処理</p> </body> </html> この三つのファイルを同じ階層に置き、index.htmlで実行したところ 非同期通信(testのアラート)が表示されました。 そこで、 index.htmlファイルの左側にメニューを設けて、 メニューをクリックすると、画像のみが切り替わるという 内容で、jqueryによるajax実装を行いたいのです。 (左のメニュー1がクリックされれば、リンゴの画像。 メニュー2がクリックされれば、みかんの画像等) ulタグと、jquery関数にどういう仕掛けを入れると 果物画像の入れ替えが行えるでしょうか。 ご教授お願いします。
- ベストアンサー
- AJAX
- フォルダ内のファイル名を取得、エラーになる原因は？
指定したフォルダ内のファイル名を１つずつ取得するサンプルコードです。 function ForlderInImgGet() { CR = String.fromCharCode(13); folder = new Folder ("../img/"); files = folder.getFiles(); for (i=0; i<files.length; i++) { txt = txt + files[i].fullName + CR; } alert(txt); } 実行すると「Folder is not defined」というエラーになってしまいます。 画像ファイルは、 ルートディレクトリ\test\img\に01.jpg～10.jpgがあります。 jsファイルは、 ルートディレクトリ\test\js\に配置してあります。 一体なぜこのようなエラーが出てしまうのでしょうか。
- ベストアンサー
- JavaScript
- JavascriptとJqueryを混在し記述
JavascriptとJqueryが混在したスクリプトファイル（.js)の書き方について質問です。 Jquery自体がjavascriptで書かれており結局はjavascriptであるということは理解していますが 気になるので質問させてください。 通常、javascriptの書き方として、スクリプトやその関数定義を１つのjsファイルに書くと思いますが、 Jqueryが混在しても考えは一緒で、ただ、ページが全て読み込まれた後（要素を特定できるようにするため）に実行したい場合の スクリプトを $(function(){ //Jquryや通常のjavascript }); の中にこのように書けばいいって話ですよね？ つまり1つのjsファイル内に以下のようにスクリプトを混在させた書き方でもいいのですよね？ ===== script.js ====== //(1)Javaスクリプト ←jsファイルが読み込まれたら実行するスクリプト //関数定義 function test(){ //Javaスクリプト } //(2)Jquery ←ページが全て読み込まれた後で実行するスクリプト $(function(){ //Jqueryスクリプト //Javaスクリプト }); 初歩的なことかもしれませんがすいません。
- ベストアンサー
- JavaScript
- jqueryにて
こちらではお初にお世話になります。 よろしくおねがいします！ さて、jqueryを用いてScrollFollowを実装中なのですが、 正常に動作させることが出来ません。 ソースは <script type="text/javascript" src="./jslib/ui.core.js"></script> <script type="text/javascript" src="./jslib/jquery-1.2.6.js"></script> <script type="text/javascript" src="./jslib/jquery.scrollfollow.js"></script> <script type="text/javascript" src="./jslib/jquery.easing.1.3.js"></script> <script type="text/javascript" src="./jslib/jquery.cookie.js"></script> <script type="text/javascript"> $( document ).ready( function (){ $('test').scrollFollow({ }); }); </script> をヘッド部分に、 <div id="test"> コンテンツ </div> をBODYに記述しています。 動作せずにFirefoxのエラーコンソールで確認したところ エラー: jQuery is not defined ソースファイル: （省略）update/jslib/ui.core.js 行: 238 エラー: $("test").scrollFollow is not a function ソースファイル: http://contest2009.thinkquest.jp/tqj2009/110392/update/ 行: 13 と表示されました。jsファイルの生存は確認できており、 その系統のミスではないと思うのですが。。。 どなたかアドバイスをお願いします！
- ベストアンサー
- JavaScript
- jQuery LightBox Plugin動かず
複数の画像をLightBoxで表示したくて http://shanabrian.com/web/library/jlightbox.php#option のページ参考にテストしてみました。紹介されてるダウンロードページからデータを取得し、 解凍後、css、images、jsディレクトリを適用するファイルと同じディレクトリに設置しました。 そしてJavaScriptおよびCSSをhead内にコピーし a要素にrel="lightbox"を追加 これで完了のはずですが、しかし動作しません。 画像のページが開いてしまいます。なぜ動かないのでしょうか？ <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>テスト</title> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <script type="text/javascript"> $(function() { $('#gallery a').lightBox(); }); </script> </head> <body> <a href="images/sample1.jpg" rel="lightbox"><img src="photos/image1.jpg" width="200" height="300"></a> <a href="images/sample2.jpg" rel="lightbox"><img src="photos/image2.jpg" width="200" height="300"></a> <a href="images/sample3.jpg" rel="lightbox"><img src="photos/image3.jpg" width="200" height="300"></a> </body> </html> お願いします。
- ベストアンサー
- JavaScript
- jQuery:要素の位置情報の保持について
jQuery:要素の位置情報の保持について 現在、IE8,jQuery 1.4.1,jQuery UI 1.8.1の環境でWebアプリケーションの作成を行っています。 画像ファイルを（マウスの）ドラッグで移動させ、ドロップした後の位置情報を保持し、再びそのWebアプリケーションを起動させた時に画像ファイルが移動した後の位置のままというようにしたいと考えています。 このようなことは可能でしょうか？ もし可能な場合、何か参考となるコードやキーワードを教えていただけないでしょうか？ 画像ファイルを移動させる事までは確認しましたので載せておきます。 <html> <head> <title>ドラッグで要素移動title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <link rel="stylesheet" href="style.css" type="text/css" /> <link rel="stylesheet" href="../Scripts/jquery-ui-1.8.1.custom.css" type="text/css" /> <script type="text/javascript" src="../Scripts/jquery-1.4.1.min.js"></script> <script type="text/javascript" src="../Scripts/jquery-ui-1.8.1.custom.min.js"></script> <script type="text/javascript" language="JavaScript"><!-- $(function () { $("img.mover").draggable({ opacity: 0.5, cursor: "move", grid: [20, 20], stop: function () { var x = $(this).css("left");//この値をどこかで保持しておきたい var y = $(this).css("top");//この値をどこかで保持しておきたい alert("左：" + x + "、上：" + y ); } }); }); //--></script> </head> <body> <img src="pic1.jpg" class="mover" alt="test" /> <img src="pic2.jpg" class="mover" alt="test" /> <img src="pic3.jpg" class="mover" alt="test" /> </body> </html>
- 締切済み
- AJAX
- JQueryでhtmlファイルをライトボックス的に
jQuery についてまなびはじめなのですが、 index.html と foo.html というファイルが同一階層にあり、 index.htmlのなかの<img src="foo.jpg" id="foo">という画像をクリックすると、 ライトボックスのように、foo.htmlの中身が出現するようにするにはどうすればいいでしょうか？ JQueryを使うらしいということはわかるのですが、それ以上わかりません。 以上、よろしくお願いします。
- 締切済み
- JavaScript
- jqueryの質問
今楽天ショップサイトを制作しています。 htmlとcssの知識はある程度あります。 crossSlideというプラグインを使ったのですが、 javascriptに追記してリンクを新しいタブかウィンドウで開く方法はあるのでしょうか。 どなたかよろしくお願いいたします。 ソースは下記のようにしています。 <script type="text/javascript" src="js/jquery.js"></script><script type="text/javascript" src="js/jquery.cross-slide.js"></script> <script type="text/javascript"> <!-- $(document).ready(function() { $('#feature').crossSlide({sleep:1.9,fade:0.7}, [ {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image1.jpg', href: 'http://item.rakuten.co.jp/' }, {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image2.jpg', href: 'http://item.rakuten.co.jp/' }, {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image3.jpg', href: 'http://item.rakuten.co.jp/' }, {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image4.jpg', href: 'http://item.rakuten.co.jp/' }, {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image5.jpg', href: 'http://item.rakuten.co.jp/' }, {src: 'http://image.rakuten.co.jp/店名/cabinet/js_images/js_image6.jpg', href: 'http://item.rakuten.co.jp/' } ]); }) --> </script>
- ベストアンサー
- JavaScript
- jqueryでの文字置換について
jqueryを使った文字の置換を行いたいのですがうまくいきません。 どなたかお詳しい方、ご教授いただけますでしょうか。 よろしくお願いします。 ■行いたいこと <div class="bbb"><img src="0123.jpg"></div> をwindow読み込み時に <div class="bbb"><img src="0123s.jpg"></div> と置き換えしたい。 javascriptのソースは以下の通りです。 <script src="jquery-min.js"></script> <script type="text/javascript"> <!-- $(function(){ var aaa = $('.bbb'); aaa.html().replace(/.jpg/ig, "s.jpg"); }); // --> </script>
- ベストアンサー
- JavaScript
お礼
大変遅くなってすいません、ありがとうございました。