my-- の回答履歴

全161件中141~160件表示
  • 3連セレクトボックスで選択肢を変更し条件を絞り込む

    現在、JavaScriptの勉強中です。 三つの連動したセレクトボックスを利用して選択肢を絞り込もうと考えています。 例えば最初のセレクトボックスで「都道府県」を選択させ、選んだ段階で、二番目のセレクトボックスに選んだ都道府県の中にある「市町村」を表示させる、 次に二番目の「市町村」の一つを選んだ段階で、三番目のセレクトボックスに選んだ「市町村」内の支店名を表示させ選択させる。というものです。 以下のようなソースがあるのですが、この内容だと、最初の選択肢の数が10個を超えた段階で次の選択肢が作動しなくなる事が、 動作上で確認されました。 一つのセレクトボックスの選択肢の数を100個程度、或いは、理論上無制限にするには、どの様にしたらよいかを考えています。 できれば、現在のソースのロジックの解説も併せて、ご教授頂ければ幸いです。 以下JavaScript内容--------------- var data = new Array("都道府県は?","東京都","神奈川","千葉"); var data0 = new Array("---"); var data1 = new Array("区は?","千代田区","中央区","品川区");    var data2 = new Array("市町村は?","横浜市","川崎市");     var data3 = new Array("市町村?","千葉市","市原市");     var data10 = new Array("---"); var data11 = new Array("支店名は?","千代田1号店","千代田2号店","千代田3号店"); var data12 = new Array("支店名は?","中央区1号店","中央区2号店","中央区3号店","中央区4号店","中央区5号店"); var data13 = new Array("支店名は?","品川1号店","品川2号店"); var data20 = new Array("---"); var data21 = new Array("支店名は?","横浜1号店","横浜2号店","横浜3号店","横浜4号店"); var data22 = new Array("支店名は?","川崎1号店","川崎2号店","川崎3号店"); var data30 = new Array("---"); var data31 = new Array("支店名は?","千葉1号店","千葉2号店"); var data32 = new Array("支店名は?","市原1号店"); function SetList(objid, arr){ var obj = document.getElementById(objid); for(i=obj.length; i>=0; i--){ obj.options[i] = null; } for(i=0; i<arr.length; i++){ obj.options[i] = new Option(arr[i]); obj.options[i].value = arr[i];}} 以下、HTML内容--------------- <body onLoad="SetList('sel0', data);" style="margin:0px;"> <div> <form> <select id="sel0" name="sel0" style="width:160px;" onChange="SetList('sel2',data0);SetList('sel1', eval('data' + this.selectedIndex))"> <option>---</option> </select> <select id="sel1" name="sel1" style="width:160px;" onChange="SetList('sel2', eval('data' + document.forms[0].sel0.selectedIndex + this.selectedIndex))"> <option>---</option> </select> <select id="sel2" name="sel2" style="width:160px;"> <option>---</option> </select> </form> </div> </body>

  • 外部ページからハッシュタグ(#)のリンクへ正しく飛ばない

    外部のページから、ハッシュタグを加えたURLを指定し 自分のページの指定した箇所を表示させたいのですが、 正しい位置に飛びません。 ・自分のページの指定箇所 <div id="■■■"> ・外部ページのリンク指定 a href="http://○○○○○.jp/#■■■" ちなみに、自分のページは基本indexのみで、 ものすごく長く(height10000pxくらい)、 ハッシュタグを使ったjava scriptのページスクロールで 指定箇所を行き来できるようにしています。 <script type="text/javascript"> jQuery.fn.extend({ scrollTo : function(speed, easing) { <!-- hashの取得が出来なければ、処理を中断 --> if(!$(this)[0].hash || $(this)[0].hash == "#") { return false; } return this.each(function() { var targetOffset = $($(this)[0].hash).offset().top; $('html,body').animate({scrollTop: targetOffset}, speed, easing); }); } }); $(document).ready(function(){ $('a[href*=#]').click(function() { $(this).scrollTo(1200); return false; }); }); </script> 自分のページのソースは簡略化すると 以下のような感じになります。 <body> <div id="□□□"></div> ←1番上です <div id="□□□□"></div> <div id="□□□□□"></div> <div id="■■■"></div> <div id="■■■■"></div> <div id="■■■■■"></div> ←1番下です </body> 現状、外部からリンクした場合は、 ページ上部の<div id="□□□"><div id="□□□□"><div id="□□□□□">には正しく飛びますが、 何故か、ページ下部の<div id="■■■"><div id="■■■■"><div id="■■■■■">になると 指定しても、最下部に飛ばされる状態です。 何度か検証をしてみたところ <div id="□□□□□"></div>と<div id="■■■"></div>を入れ替えた場合、  <div id="■■■"></div>は正しくリンク位置へ  <div id="□□□□□"></div>は最下部へ となりました。 どうも位置(高さ)による原因のようなのですが、 さっぱりわかりません。。 原因分かる方、いらっしゃいませんでしょうか。。。。。。

  • 前のページに戻るとページトップに戻るの併用方法

    ホームページのページ内に前のページに戻るボタンとページトップ(同ページの最上部)に戻るボタンの両方をJavaScriptで設置したいのですが、方法がわかりません。 前のページに戻るは <a href="javascript:history.back()">戻る</a> としています。 ページトップ(同ページの最上部)に戻るは <a href="javascript:scrollTo(0,0);undefined;" onclick="return false;">ページトップに戻る</a> としています。 以上の両方を併用する方法を教えていただけないでしょうか? よろしくお願いします。

  • javascriptでselectboxのvalueを取得し、特定のv

    javascriptでselectboxのvalueを取得し、特定のvalue値により、「<input type="text" name~>」をブラウザに表示させたいのですが、やり方がわかりません。 javascriptについて素人です。 jQUERYを使用して、phpのようにif文を追加したらいけるのかなと思って下記のようにやってみたのですが、更新しないと変わりませんでした。。 どなたかお力を貸して下さい!どうか宜しくお願い致します! ========================================== <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" /> <meta name="robots" content="noindex,nofollow" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="/admin/js/jquery-1.2.3.js" ></script> <script type="text/javascript"> $(function() { hogehoge = $("#abcdefg").val(); if(hogehoge !== '3'){ $('#hijklmn').hide(); } }); </script> </head> <body> <form method="post" action="/admin/~"> <select id="abcdefg"> <option value="1">aaaaaaaa</option> <option value="2">bbbbbbbb</option> <option value="3">cccccccc</option> </select> <div id="hijklmn"> 上のセレクトボックスが3の場合のみ、下記のフォームを表示させたい <input type="text" value="ああああああああ" /> </div> </form> </body> </html>

  • jQueryのroundaboutで画像挿入の際IEでの不具合について。

    jQueryのRoundaboutで画像を挿入した際にIE6で表示テストしたのですが IEでのみズレが生じてしまいます。ハックだったり試したのですが 解決に至りませんでした。どうぞよろしくお願いいたします。 これが問題のIE表示です。http://www.imagecheese.com/images/1zvz.jpg こちらがFireFox表示の正しいほうです。http://www.imagecheese.com/images/2udu.jpg <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "​​http://www.w3.org/TR/html4/loose.dtd">​​ <HTML><head><title>web page title</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Language" content="ja"> <style type="text/css"> /*CSS*/ -------------------------------------------------------- .roundabout-holder { list-style: none; width: 80%; height: 20em; margin: 1em auto; } .roundabout-moveable-item { height: 15em; width: 44.375em; border: 1px dotted #999; background-color:pink; cursor: pointer; } .roundabout-moveable-item img {/*画像の大きさ*/ height: 15em; width: 44.375em; .roundabout-in-focus { cursor: auto; } <body>------------------------------------------------------------------ <ul id="myRoundabout"> <li><img src="pic/block1.jpg"></li> <li><img src="pic/block2.jpg"></li> <li><img src="pic/block3.jpg"></li> </ul> <script type="text/javascript" src="common1/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="common1/js/jquery.roundabout-1.0.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('ul#myRoundabout').roundabout({ minOpacity: 0.3, // 後ろのメニューの透明度 minScale: 0.5 // 後ろのメニューの縮小率 }); }); </script> </body> </html> -------------------------------------------------------------------------------------------- jquery roundabout http://www.fredhq.com/projects/roundabout/ 個人的にはCSSの問題かなぁと思っているのですがroundaboutの問題だったらと思ってこちらでも質問させていただきました。 画像は900px×300pxです。 本当に困ってます、よろしくおねがいします

  • jQueryのroundaboutで画像挿入の際IEでの不具合について。

    jQueryのRoundaboutで画像を挿入した際にIE6で表示テストしたのですが IEでのみズレが生じてしまいます。ハックだったり試したのですが 解決に至りませんでした。どうぞよろしくお願いいたします。 これが問題のIE表示です。http://www.imagecheese.com/images/1zvz.jpg こちらがFireFox表示の正しいほうです。http://www.imagecheese.com/images/2udu.jpg <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "​​http://www.w3.org/TR/html4/loose.dtd">​​ <HTML><head><title>web page title</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Language" content="ja"> <style type="text/css"> /*CSS*/ -------------------------------------------------------- .roundabout-holder { list-style: none; width: 80%; height: 20em; margin: 1em auto; } .roundabout-moveable-item { height: 15em; width: 44.375em; border: 1px dotted #999; background-color:pink; cursor: pointer; } .roundabout-moveable-item img {/*画像の大きさ*/ height: 15em; width: 44.375em; .roundabout-in-focus { cursor: auto; } <body>------------------------------------------------------------------ <ul id="myRoundabout"> <li><img src="pic/block1.jpg"></li> <li><img src="pic/block2.jpg"></li> <li><img src="pic/block3.jpg"></li> </ul> <script type="text/javascript" src="common1/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="common1/js/jquery.roundabout-1.0.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('ul#myRoundabout').roundabout({ minOpacity: 0.3, // 後ろのメニューの透明度 minScale: 0.5 // 後ろのメニューの縮小率 }); }); </script> </body> </html> -------------------------------------------------------------------------------------------- jquery roundabout http://www.fredhq.com/projects/roundabout/ 個人的にはCSSの問題かなぁと思っているのですがroundaboutの問題だったらと思ってこちらでも質問させていただきました。 画像は900px×300pxです。 本当に困ってます、よろしくおねがいします

  • 特定のページを表示するとクッキーで文章が変わる・追加されるようにするには

    私は今、長編小説をHPに公開しようと思っています。 キャラクター紹介のページを作ろうと思っているのですが、 読んだ読者さんによって表示される内容を変えたいのです。 例えば第一章で登場するAとBというキャラがいたとします。 読者さんが第一章を読んだらキャラ紹介のページにAとBのキャラクターの紹介が加わる。 という形にしたくて、cookieを使用しようと思うのですが、 なにぶんこのような操作ははじめてでしてどうしたらよいのかわかりません。 各章の最後のページにクッキーを食べさせるjavascriptを書いて、 キャラ紹介のページでクッキーを読み込み、キャラの説明文を表示したいです。 物語が進むにつれて、他キャラが増えたり、説明文に追記が加わるようにするにはどうしたら良いでしょう。 cookie使用があまりなく、調べましたがよくわかりませんでしたので詳しく教えていただけましたら幸いです。

    • ベストアンサー
    • noname#103778
    • JavaScript
    • 回答数4
  • jQueryを用いたドラッグ&ドロップについて

    jQueryを用いてドラッグ&ドロップによって要素を移動できるプログラムを書いています。 draggableとdroppableによって「要素を移動しました」とメッセージを表示させる事は出来ましたが、ドロップした所へ要素をcloneでコピーし、appendで追加するとその要素はドラッグ出来ません。 その原因として、javascriptが読み込まれた後に生成された要素に対してjavascriptが機能しないからだと思っています。 目的としましては、 1.要素をドラッグ&ドロップで移動可能とし、  2.ドロップされた所へ要素を挿入し、 3.ドロップされた順番に整列を行い、 4.また他の要素内へドラッグ可能 とした機能を実現したいと考えています。 特に3番目の「ドロップされた要素をドロップした要素内に整列を行う」箇所に重点をおいています。 アドバイス宜しくお願いします。

  • bt_melter.jsをサイトの一部のみに適応させたい。また演算の方

    bt_melter.jsをサイトの一部のみに適応させたい。また演算の方法を1種類にしたい。 という、サイト全体をマトリックス風に演算して表示させるjsがあるのですが このまま<body>タグ内にいれてしまうと、サイト全体が適応されてしまいますので たとえば #hoge というようにIDをふってそのIDのみ適応されるようにするにはどこをいじればよいでしょうか? http://bodytag.org/bt_melter/ jsファイル本体: http://bodytag.org/bt_melter/bt_melter.js

  • bt_melter.jsをサイトの一部のみに適応させたい。また演算の方

    bt_melter.jsをサイトの一部のみに適応させたい。また演算の方法を1種類にしたい。 という、サイト全体をマトリックス風に演算して表示させるjsがあるのですが このまま<body>タグ内にいれてしまうと、サイト全体が適応されてしまいますので たとえば #hoge というようにIDをふってそのIDのみ適応されるようにするにはどこをいじればよいでしょうか? http://bodytag.org/bt_melter/ jsファイル本体: http://bodytag.org/bt_melter/bt_melter.js

  • bt_melter.jsをサイトの一部のみに適応させたい。また演算の方

    bt_melter.jsをサイトの一部のみに適応させたい。また演算の方法を1種類にしたい。 という、サイト全体をマトリックス風に演算して表示させるjsがあるのですが このまま<body>タグ内にいれてしまうと、サイト全体が適応されてしまいますので たとえば #hoge というようにIDをふってそのIDのみ適応されるようにするにはどこをいじればよいでしょうか? http://bodytag.org/bt_melter/ jsファイル本体: http://bodytag.org/bt_melter/bt_melter.js

  • ページ先頭にスムーズに移動(アンカータグ不使用)

    上記の件、<a href="javascript:window.scroll(0,0)">Top</a>だと、カチカチの動きなので、これを滑らかにしたいと思い、教えて頂けると助かります。 【前提】 1.アンカータグ使用で、ページ先頭にスムーズに移動させる方法は、 http://smallwebmemo.blog113.fc2.com/blog-entry-245.html のように、いくつも紹介サイトがありますが、ある理由で、アンカータグが使えません。 2.そこで、苦肉の策で、window.scrollTo(0,0)を使って、以下のようにしてみました。 【試したスクリプト】 ■外部javascriptファイル名:scroll.js var interval=100;//0.1秒後に、実行 var n=0;//下のfor文のiを代入する変数 function pageScroll(){ for(i=500;i>=0;i--){//決め打ちで、500pxlから開始して、0まで window.scroll(0,i); n=i;//500→0まで変化し、最後は、0となる } if(n>0){//0より大きいなら、setTimeout();を有効とする、n=0なら、無効 setTimeout("pagescroll()",interval); } } ■html側: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>テスト</title> <script src="./scroll.js" language="javascript"></script> </head> <body topmargin="0" leftmargin="0"> <img src="0.jpg"/><br><br> <a href="javascript:pageScroll()">Top</a> </body> </html> 【結果】 ■動くことは動くのですが、ページごとにスクロール量が極端に異なるので、決め打ちの500からの開始ですと、ものすごく遅いページとそうでないページに極端に分かれます。仕方なく、上記のiの初期値を50として、開始位置を、topのすぐ近くにして、「カチカチではないかなぁ」という程度にしてます。→要は、ごまかしです。 【お教え頂きたいこと】 ■アンカータグを使わず、window.scrollTo(0,0);かscrollBy();などを使って、同様な動きを付ける方法、もしくは、サイト名が、おわかりになる方は、教えて頂きたいと思います。 よろしくお願いします。

  • bt_melter.jsをサイトの一部のみに適応させたい。また演算の方

    bt_melter.jsをサイトの一部のみに適応させたい。また演算の方法を1種類にしたい。 という、サイト全体をマトリックス風に演算して表示させるjsがあるのですが このまま<body>タグ内にいれてしまうと、サイト全体が適応されてしまいますので たとえば #hoge というようにIDをふってそのIDのみ適応されるようにするにはどこをいじればよいでしょうか? http://bodytag.org/bt_melter/ jsファイル本体: http://bodytag.org/bt_melter/bt_melter.js

  • ページ先頭にスムーズに移動(アンカータグ不使用)

    上記の件、<a href="javascript:window.scroll(0,0)">Top</a>だと、カチカチの動きなので、これを滑らかにしたいと思い、教えて頂けると助かります。 【前提】 1.アンカータグ使用で、ページ先頭にスムーズに移動させる方法は、 http://smallwebmemo.blog113.fc2.com/blog-entry-245.html のように、いくつも紹介サイトがありますが、ある理由で、アンカータグが使えません。 2.そこで、苦肉の策で、window.scrollTo(0,0)を使って、以下のようにしてみました。 【試したスクリプト】 ■外部javascriptファイル名:scroll.js var interval=100;//0.1秒後に、実行 var n=0;//下のfor文のiを代入する変数 function pageScroll(){ for(i=500;i>=0;i--){//決め打ちで、500pxlから開始して、0まで window.scroll(0,i); n=i;//500→0まで変化し、最後は、0となる } if(n>0){//0より大きいなら、setTimeout();を有効とする、n=0なら、無効 setTimeout("pagescroll()",interval); } } ■html側: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>テスト</title> <script src="./scroll.js" language="javascript"></script> </head> <body topmargin="0" leftmargin="0"> <img src="0.jpg"/><br><br> <a href="javascript:pageScroll()">Top</a> </body> </html> 【結果】 ■動くことは動くのですが、ページごとにスクロール量が極端に異なるので、決め打ちの500からの開始ですと、ものすごく遅いページとそうでないページに極端に分かれます。仕方なく、上記のiの初期値を50として、開始位置を、topのすぐ近くにして、「カチカチではないかなぁ」という程度にしてます。→要は、ごまかしです。 【お教え頂きたいこと】 ■アンカータグを使わず、window.scrollTo(0,0);かscrollBy();などを使って、同様な動きを付ける方法、もしくは、サイト名が、おわかりになる方は、教えて頂きたいと思います。 よろしくお願いします。

  • ページ先頭にスムーズに移動(アンカータグ不使用)

    上記の件、<a href="javascript:window.scroll(0,0)">Top</a>だと、カチカチの動きなので、これを滑らかにしたいと思い、教えて頂けると助かります。 【前提】 1.アンカータグ使用で、ページ先頭にスムーズに移動させる方法は、 http://smallwebmemo.blog113.fc2.com/blog-entry-245.html のように、いくつも紹介サイトがありますが、ある理由で、アンカータグが使えません。 2.そこで、苦肉の策で、window.scrollTo(0,0)を使って、以下のようにしてみました。 【試したスクリプト】 ■外部javascriptファイル名:scroll.js var interval=100;//0.1秒後に、実行 var n=0;//下のfor文のiを代入する変数 function pageScroll(){ for(i=500;i>=0;i--){//決め打ちで、500pxlから開始して、0まで window.scroll(0,i); n=i;//500→0まで変化し、最後は、0となる } if(n>0){//0より大きいなら、setTimeout();を有効とする、n=0なら、無効 setTimeout("pagescroll()",interval); } } ■html側: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>テスト</title> <script src="./scroll.js" language="javascript"></script> </head> <body topmargin="0" leftmargin="0"> <img src="0.jpg"/><br><br> <a href="javascript:pageScroll()">Top</a> </body> </html> 【結果】 ■動くことは動くのですが、ページごとにスクロール量が極端に異なるので、決め打ちの500からの開始ですと、ものすごく遅いページとそうでないページに極端に分かれます。仕方なく、上記のiの初期値を50として、開始位置を、topのすぐ近くにして、「カチカチではないかなぁ」という程度にしてます。→要は、ごまかしです。 【お教え頂きたいこと】 ■アンカータグを使わず、window.scrollTo(0,0);かscrollBy();などを使って、同様な動きを付ける方法、もしくは、サイト名が、おわかりになる方は、教えて頂きたいと思います。 よろしくお願いします。

  • javascriptのソースでvar result = c * (t

    javascriptのソースでvar result = c * (t /= d) * t + b;という関数は何を計算しているのでしょうか? 東京インタラクティブ・アド・アワードのサイトのソースをみたのですが、 http://tokyo.interactive.ad.awards.jp/Results09/index.html ソースの中にある <script type="text/javascript"> smoothEaseIn = function(t, b, c, d){ var result = c * (t /= d) * t + b; return result; } //new wrapScroll('sidemenu','content'); var mov2 = new wrapScroll('backtop','content05'); mov2.setTween(smoothEaseIn, 100); </script> のうち、 == smoothEaseIn = function(t, b, c, d){ var result = c * (t /= d) * t + b; return result; == の部分は何を計算しているのでしょうか? 「c * (t /= d) * t + b;」の部分はどういう意味でしょうか? この部分が「wrapscroll.js」をあらわしているのはわかるのですが、その他のことがあまりわかりません。 詳しい方、ご教授いただけませんでしょうか?

  • JavaScriptによるページ内検索での検索方向

    こんにちは、JavaScriptを使ったページ内検索についての質問です。 http://computer.shipweb.jp/soft/pageinserch.htm こちらのサイト様を参考に、自分のサイトにページ内検索をつけ正常に作動はしましたが、 検索方向が「上から下」の一方のみになっています。 これを「下から上」方向へも検索出来ないかと考えているのですが、 JavaScriptに関してほぼ無知に近い為何をどう変えれば良いのかわからず困り果てております; 検索方向の記述がどこの部分なのか、出来ればどう変えれば良いのかも、 分かる方がいらっしゃいましたらご教授お願い致します。

  • JavaScriptによるページ内検索での検索方向

    こんにちは、JavaScriptを使ったページ内検索についての質問です。 http://computer.shipweb.jp/soft/pageinserch.htm こちらのサイト様を参考に、自分のサイトにページ内検索をつけ正常に作動はしましたが、 検索方向が「上から下」の一方のみになっています。 これを「下から上」方向へも検索出来ないかと考えているのですが、 JavaScriptに関してほぼ無知に近い為何をどう変えれば良いのかわからず困り果てております; 検索方向の記述がどこの部分なのか、出来ればどう変えれば良いのかも、 分かる方がいらっしゃいましたらご教授お願い致します。

  • jQuery タブメニューへのダイレクトリンクの仕方を教えてください。

    jQuery UI タブ http://allabout.co.jp/internet/javascript/closeup/CU20071220A/index2.htm を参考にタブメニューを制作しているのですが、 同ページ及び、他ページから各タブメニューへ ダイレクトにリンクすることはできるのでしょうか。 ただ、ここで http://allabout.co.jp/internet/javascript/closeup/CU20071220A/index2.htm#tab2-3 とリンク先を指定すると「ソース」というところに ダイレクトにリンクするのですが、 ボタン等で指定するとうまくリンクしません。。。。。 方法があれば教えてください。 よろしくお願いします。

  • オブジェクト指向で書いた時のフォーム値受取り

    オブジェクト指向で記述したときの、フォームの値の受取の記述方法 がわかりません。 例えば下記のようなフォームがあったとすると ---------------------- <form name="test"> <input type="text" name="name"> <input type="button" value="送信" onClick="testAlert()"> </form> ---------------------- 手続き型では ============================= function testAlert(){  var name = document.test.name.value;  alert(name); } ============================= こんな感じで値を受取りアラート出力できますが、 オブジェクト指向で記述した場合はどうなりますか? ============================= var aaa = function(name){  this.name = name; }; aaa.prototype.test = function(){  return alert(name); }; ============================= こういうような感じだとは思うのですが、ここから先が分かりません。 よろしくお願いします。