[過去ログ] + JavaScript の質問用スレッド vol.117 + (1001レス)
1-
抽出解除 レス栞

このスレッドは過去ログ倉庫に格納されています。
次スレ検索 歴削→次スレ 栞削→次スレ 過去ログメニュー
1
(3): デフォルトの名無しさん [] 2014/07/01(火) 01:37:24.78 ID:U4Rt/XmH(1/5) AAS
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-5のテンプレを読んだ上で質問してください。

■投稿する上で
(1) 煽り、暴言等の他人を不快にさせる投稿はご遠慮下さい。
(2) 迷惑スクリプトの質問はご遠慮ください。
(3) 質問者及び議論を行う人は名前にレス番を入れることを推奨します。
(4) 常に自発的に調べる心構えを持ってください。
  具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
  わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
  ※必ず「問題の事象が再現されること」を確認してください。
   必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は 外部リンク:validator.w3.org で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。>>2
2(4): デフォルトの名無しさん [] 2014/07/01(火) 01:40:15.72 ID:U4Rt/XmH(2/5) AAS
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
 1レスに収まらないならコード投稿サイトを利用してください。
 外部リンク:jsdo.it 外部リンク:jsbin.com 外部リンク:jsfiddle.net 外部リンク:ideone.com

■前スレ
+ JavaScript の質問用スレッド vol.116 +
2chスレ:hp
■過去スレ全集
外部リンク:www2.atpages.jp
外部リンク:usamimi.info (閲覧のみ)
■テンプレ案
外部リンク:jsfiddle.net
■関連スレ
ECMAScript デス 4
2chスレ:tech
JavaScript ライブラリ総合質問所 vol.4
2chスレ:hp
【WHATWG】HTML5 Part6【W3C HTML WG】
2chスレ:hp
Canvasについて語ろう
2chスレ:hp
JavaScript 3
2chスレ:tech
CSS初心者スレッド=12th=
2chスレ:hp
Webサイト制作初心者用質問スレ part240
2chスレ:hp
の質問テンプレートを活用してみてください。
(9) ライブラリ関連の質問は禁止です。関連スレにあるライブラリ質問スレで質問して下さい。
(10) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。
4
(3): デフォルトの名無しさん [] 2014/07/01(火) 01:42:58.91 ID:U4Rt/XmH(4/5) AAS
■各種仕様 ( 外部リンク:fiddle.jshell.net も参照 )
◆ Standard ECMA-262
外部リンク:www2u.biglobe.ne.jp (ECMAScript 3 和訳)
外部リンク:www.ecma-international.org (ECMAScript 5.1 HTML版)
外部リンク[html]:people.mozilla.org (ECMAScript 6 有志HTML版)
外部リンク:kangax.github.io (ECMAScript 5 compatibility table)
外部リンク:kangax.github.io (ECMAScript 6 compatibility table)
◆ HTML Standard (HTML5)
外部リンク:www.whatwg.org
外部リンク[html]:momdo.s35.xrea.com (HTML5.1 部分訳)
外部リンク[html]:www.hcn.zaq.ne.jp (Web Storage 和訳)
◆ Document Object Model (DOM) / CSS Object Model (CSSOM)
外部リンク[html]:www.hcn.zaq.ne.jp (DOM Standard (DOM4) 和訳)
外部リンク:www.w3.org (DOM3 Events)
外部リンク:www.w3.org (UI Events)
外部リンク[html]:www.hcn.zaq.ne.jp (CSSOM 和訳)
外部リンク[html]:www.hcn.zaq.ne.jp (CSSOM View Module 和訳)
◆ その他のWeb関連仕様
外部リンク:domparsing.spec.whatwg.org (DOM Parsing and Serialization - innerHTML等)
外部リンク[html]:www.hcn.zaq.ne.jp (XMLHttpRequest 和訳)
外部リンク[html]:www.hcn.zaq.ne.jp (File API 和訳)
外部リンク:www.whatwg.org (WHATWGの仕様一覧)
◆ MDN (Netscape/Mozilla)
外部リンク:developer.mozilla.org
◆ JavaScript Garden (ja)
外部リンク:bonsaiden.github.com
◆ JSON (JavaScript Object Notation)
外部リンク[html]:www.json.org
◆ MSDN Library
外部リンク[aspx]:msdn.microsoft.com (JavaScript)
外部リンク[aspx]:msdn.microsoft.com (JScript)
外部リンク[aspx]:msdn.microsoft.com (DHTML)
34
(3): デフォルトの名無しさん [] 2014/07/17(木) 10:31:47.77 ID:Q5y1Yz1u(1) AAS
【環境】IE9・IE10・Firefox・Chrome
【何をしたのか】ファイルをPOSTした
【エラーメッセージ】特になし
【期待する結果】画面遷移をせずに選択したファイルをPOST送信したい
【サンプルコード】
こちらでの質問でよいのか判断がつきかねるのですが
type=fileで選択した画像をPOSTしたいと考えておりますが

var image = $("#registerd [name=image]").val();

としてもimageには何も入っておりません。
その他のtype=textなどは取得できてPOST出来ております。

選択された画像を取得するにはどのようにすれば良いのでしょうか?
識者の方たちのアドバイスいただけると助かります。
94
(17): デフォルトの名無しさん [] 2014/08/10(日) 01:48:25.33 ID:Zb+KAjkq(2/3) AAS
>93
93(2): デフォルトの名無しさん [sage] 2014/08/10(日) 01:46:06.35 ID:u1URIHVh(1/7) AAS
あせり過ぎて未来からの書き込みとは。。。
携帯からの表示と自分のパソコンからの表示が違うのでおどおどしてます
パソコンからは94があるんですよー自分のブラウザだけかもしれませんが
107
(3): デフォルトの名無しさん [sage] 2014/08/10(日) 02:56:01.74 ID:xdwi6sFr(3/13) AAS
>>94
あなたのやりたかったことはこれでいい?

外部リンク:jsbin.com

$('.switch-text').on('click', function() {
 var index = $('.switch-text').index(this);
 $('.switched-text').addClass('display-none').eq(index).removeClass('display-none');
});

書くよりも読むのにつかれるわw
122
(6): デフォルトの名無しさん [sage] 2014/08/10(日) 04:01:46.88 ID:Sc++4qqi(2/11) AAS
>>110,116
110(2): 94 [] 2014/08/10(日) 03:11:32.98 ID:TNaWGn4J(10/16) AAS
結局やりたいことはというと
「ボタンを押したら下部のテーブルに文字が出る。
もともと出ていたトップページの文字は消える」
ということをやりたいのです。
ひどいコードとのことでしたが、
もっとシンプルなコード、もっとちゃんとしたコードを
内容全部とは言わないのでヒント(使う機能など)だけでも教えて頂けると非常に助かります。
116(1): 94 [] 2014/08/10(日) 03:36:41.21 ID:TNaWGn4J(12/16) AAS
>>112さん
はい、このコードは捨てることにします。
数時間ググり続けてるんですけどね…
デバッグも、特に異常は表示されません。
表示したい機能を考えた上で、一から作り直そうと思います。

>>113さん
やはりそうですか…しかしjQueryを使っていないので、
このままこのコードを使うことはできないみたいです。
諦めて一から作り直します。

みなさん、ご指導本当にありがとうございました。
これからJavascriptの勉強、1から頑張っていきます。
俺ならこうする
外部リンク:jsfiddle.net
143
(5): デフォルトの名無しさん [sage] 2014/08/10(日) 06:11:56.31 ID:SkkTdbxn(1) AAS
>>131
131(1): デフォルトの名無しさん [sage] 2014/08/10(日) 05:00:53.52 ID:awdBi9qt(1/2) AAS
簡単DB検索システムを作ります。
入力フォームのページ、検索結果リストを表示するページの2つに分けたいです。
ググっても「1つのページ内で入力して表示を出す方法」しか出てきません。
入力フォームから文字列取得、GET通信と戻り値取得は出来たのですが、
どのように組めば2ページ目に戻り値を表示できるでしょうか??
1ページ目は入力フォームのHTMLがあって、それが表示されている
そこで送信ボタンを押すと、サーバと通信して、
新しいHTMLをもらうので、それが表示される
それが2ページ目だよ

2ページ目から、1ページ目に戻りたいなら、
ブラウザの前に戻るボタンを押せばいい
146
(4): デフォルトの名無しさん [sage] 2014/08/10(日) 12:25:27.23 ID:awdBi9qt(2/2) AAS
>>143
なるほど。
今はサーバ側ではDBから取り出したデータを整形して戻り値としているのですが、
htmlとして必要なコード全てを返すようにすれば良いということですね。
別のページに検索結果データを渡して表示するようなコードが無いのは、そもそもそんな動きをJavaScriptは出来ないという…。
何となくJavaScriptの出来ること・出来ないことが見えてきた気がします。
ありがとうございました。
186
(3): デフォルトの名無しさん [sage] 2014/08/24(日) 19:37:48.18 ID:BWQfj/B3(1) AAS
フラグメント識別子にパラメタを格納すれば良い
187
(3): デフォルトの名無しさん [sage] 2014/08/24(日) 22:02:31.80 ID:thPtQl+P(1) AAS
ローカルストレージを使用すれば良い
188
(3): デフォルトの名無しさん [sage] 2014/08/24(日) 23:34:03.10 ID:1q09/hom(3/3) AAS
セッションを利用すればいい
194
(3): デフォルトの名無しさん [] 2014/08/27(水) 18:12:48.49 ID:iz8Mv+tw(1/2) AAS
クラスに書かれた内容を取得したいのですが
事前に分かるのはnameかidとなります。

<input type="text" id="email" name="email" class="hoge foo bar" value="" />

$("[class=email]").val()とすれば書き込まれた内容は取得できますが
指定id(もしくは) の class を取得するのはどのようにすればよいのでしょうか?
237
(3): デフォルトの名無しさん [sage] 2014/10/05(日) 12:00:10.83 ID:5m38AlGC(1) AAS
interHTMLが正式対応してないので便利なのにも関わらず使わないで
var new_obj = document.createElement("div");
からappendChildを使って挿入する利点はありますでしょうか?
293
(12): デフォルトの名無しさん [sage] 2014/12/02(火) 03:15:02.67 ID:MjRXeq65(1/3) AAS
外部リンク:developer.mozilla.org
初心者の JavaScript プログラマーがよくやる間違いは、
あるオブジェクトからメソッドを取り出し、後でその関数を呼び出すとき、
その内側の this 値が元のオブジェクトになると考えてしまうことです
(例えば、そのメソッドをコールバック関数に使うケース)。
特に配慮しなければ、元のオブジェクトは失われてしまいます
【訳注: 取り出した関数内の this としては使えなくなる】。
その関数に元々のオブジェクトを bind() して束縛された関数を生成すれば、
この問題をきちんと解決することができます:

var x = 9;
var module = {
x: 81,
getX: function() { return this.x; }
};

module.getX(); // 81

var getX = module.getX;
getX(); // 9, この場合 "this" はグローバルオブジェクトを参照するため

// 'this' を module に結びつけた新しい関数を生成
var boundGetX = getX.bind(module);
boundGetX(); // 81
308
(4): デフォルトの名無しさん [sage] 2014/12/02(火) 13:27:53.03 ID:OQmm7jB2(1/3) AAS
jQueryにはbindに相当するものとして、$.proxyっていうのが有るのだけれど、
なんでbindがproxyという名前なのか昔から疑問だった。
prototypejsではbindという名前なのに。

最近その謎が解けた。それは変数にthisを代入すればいいから
bindは不要であるという話にもつながっていて、

例えば、>>293みたいなものは、bindで渡すべきじゃない。
なぜなら、getXは普通に考えると自分自身のxを返すという仕様であり、
外部から指定されるべきものじゃないから。

そして外部から指定するもの。例えばあるクラスにイベントハンドラを
設定するみたいなコード。そのイベントハンドラに匿名関数を渡すのではなく、
別のオブジェクトの関数を渡す時に、$.proxyを使ってオブジェクトをバインドする。
(普通は関数だけじゃなくてオブジェクトも指定する必要があるから)

バインドしたい時というのは、このように別のオブジェクトの関数への
プロキシとして使うことがほとんどだから$.proxyという名前なんだ。
331
(3): デフォルトの名無しさん [sage] 2014/12/05(金) 00:53:39.93 ID:lxRVtaYn(1) AAS
>>330
330(1): デフォルトの名無しさん [sage] 2014/12/04(木) 23:26:08.87 ID:tYdcY83W(4/4) AAS
bind禁止? 誰が?
一体誰にレスしてるのさ。
ちょっとアンカーつけてみな。
>>308
368
(9): デフォルトの名無しさん [sage] 2014/12/08(月) 13:25:02.71 ID:uRv2wrgF(1) AAS
質問です
外部リンク:qiita.com
ここのサイトの「インスタンス作る版の例」みたいに

(function(global){
 var SitesUtil = (function() {
  function SitesUtil(site){
   this.site = site;
  }
  SitesUtil.prototype.getTemplateByName = function(templateName) {
(略)
  };
  return SitesUtil;
 })();
 global.SitesUtil = SitesUtil;
})(this);

と書いてる例を (CoffeeScript が吐いた js とかでも) 良く見かけますが
最初と最後の

(function(global){

 global.SitesUtil = SitesUtil;
})(this);

は無駄じゃないでしょうか?
なぜこう書くのでしょう?
374
(4): デフォルトの名無しさん [sage] 2014/12/08(月) 14:11:28.85 ID:e/VeyYdn(3/3) AAS
>>368のglobal束縛を生かすならこう書く

(function(global){
 function SitesUtil(site){
  this.site = site;
 }
 SitesUtil.prototype.getTemplateByName = function(templateName) {
(略)
  };
 global.SitesUtil = SitesUtil;
})(this);

>>368は無駄にクロージャを生産しすぎなんだよ
377
(4): デフォルトの名無しさん [sage] 2014/12/08(月) 15:28:29.56 ID:3mx+HWhx(4/6) AAS
>>374
(function(global){
 var SitesUtil = (function() { ← これは

 var SitesUtil = (function(super) {
...
 })(BaseClass);

とベースクラスを渡す為のもんなんだよ
> その例では確かに無駄だがイディオムとして確立してるので常にそうすべき
先人の知恵が詰まったイディオムと言ってんだからまずは理解しようとしろ
388
(4): デフォルトの名無しさん [sage] 2014/12/09(火) 04:44:35.26 ID:wgjct/yv(1) AAS
>>379
379(1): デフォルトの名無しさん [sage] 2014/12/08(月) 16:04:34.81 ID:xmgrWXtn(1) AAS
<script type="text/javascript">
/*サイコロ*/
function saikoro(){
var sai=new Array("sai1.png","sai2.png","sai3.png","sai4.png","sai5.png","sai6.png");
var imgs = document.querySelectorAll('.saikoro');
for (var i = 0; i < imgs.length; i ++) {
var r = Math.floor(Math.random()*sai.length);
imgs[i].setAttribute('src', sai[r]);}}
function masusaikoro(){
var sai=new Array("sai1.png","sai2.png","sai3.png","sai4.png","sai5.png","sai6.png");
var imgs = document.querySelectorAll('.saikoro');
for (var i = 0; i < imgs.length; i ++) {
var r = Math.floor(Math.random()*sai.length);
imgs[i].setAttribute('src', sai[r]);}}
document.write('<li>');
document.write('<img src="img/MAP.png" onMouseOver="img/MAPsenntaku.png" class="simap"/><img onclick="masusaikoro();" src="sai1.png" class="saikoro" name="saikoro">');
document.write('</li>');
</script>
</ul>
<div id="hyouzi">
</div>
</div>
<body>
</html>
マウスをサイコロに当てると、img/MAPsenntaku.pngに変わるようにしたいのですが、全然変わりません、
どう修正したらよろしいでしょうか?
外部リンク:codepad.org
470
(3): デフォルトの名無しさん [] 2014/12/20(土) 13:15:51.69 ID:z3B/t80F(1/14) AAS
失礼します。
1ページに複数の画像を並べてオンマウスで画像3枚が順番に変わるようにしたいのですが、
下記のスクリプトを2つ並べると2つ目にマウスを持って行っても1つ目の画像が変わってしまいます。
どこを変更すればいいでしょうか・・
<div><IMG SRC=".1.jpg" id="show"
onmouseover="Over()" onmouseout="Out()"></div>
<script type='text/javascript'>
var i=1;
img=new Array(3);
img[1]=".1.jpg";
img[2]=".2.jpg";
img[3]=".3.jpg";
var tid = null;
function Over() {
if (! tid) {
tid = setInterval(Switch, 500);
}
}
function Out() {
if (tid) {
clearInterval(tid);
tid = null;
}
}
function Switch() {
document.getElementById("show").src=img[i];
i=i+1;
if(i>3
3(2): デフォルトの名無しさん [] 2014/07/01(火) 01:40:40.98 ID:U4Rt/XmH(3/5) AAS
■主要FAQ (全部は 外部リンク:fiddle.jshell.net )
Q1. 別窓・フレーム内容やローカルファイルを読み書きしたいのですが…
A1. 別サーバのページやファイルの内容はセキュリティ制約でアクセス不可です。
Q2. document.write()でページ内容を追加したいのですが…
A2. 一度表示完了後にwriteするとページ内容が消去されます。DOM等別手段を。
Q3. table内容のinnerHTMLやDOMでの変更がうまく行かないのですが…
A3. IEではtable/tbody/trのinnerHTML書き換え不可です。DOMを使いますが、
  DOMの場合tableの直下にはtbody要素が(作らなくても)あることに注意。
Q4. フォーム部品名を変数にした「...myform.変数名.value」が動きません…
A4. 「document.forms.myform.elements[変数名].value」でどぞ。
  JavaScriptでは一般に「obj.x」と「obj['x']」は同じ意味です。
  グローバル変数はwindowのプロパティなので「x」と「window['x']」も。
Q5. CSSで設定した背景色がe.style.backgroundColorで取得できないのですが…
A5. 取得には document.defaultView.getComputedStyle() を使う必要あり。
  IEでは要素オブジェクトのプロパティcurrentStyleを使う。
Q6. setAttribute("class","foo")、setAttribute("onclick","bar()")が動きません…
A6. IEではそれは不可。「obj.className="foo"」「obj.onclick=bar」でどぞ。
Q7. タイマーやイベントハンドラに設定するコードにthisを含めたいのですが
  「"...this..."」とか「function(){...this...}」ではうまく行きません。
A7. 実行時にthisが別のものを指してしまってる。以下のようにthisを束縛保存。
  「function(x){return function(){...x...};}(this)」
Q8. input type="file"の値を設定(参照)できないのですが…
A8. セキュリティ制約のため設定は絶対に不可。参照はブラウザにより不可。
Q9. getElementById('ID名')や$('ID名')で要素が取れないのですが…
A9. コード実行時点でHTMLがそこまで読まれてない。window.onload 中でやるとか。
){i=1;}
}
</script>
472
(11): デフォルトの名無しさん [sage] 2014/12/20(土) 13:58:34.92 ID:dWuhsWfV(1/11) AAS
>>470
マウスイベントを取って、動的に変化させるなら、
jQueryを使うのが一般的

Web制作管理板の
jQuery ライブラリ 総合質問所 vol.4 スレで聞けば?
2chスレ:hp

どういうことをやりたいのかを、具体的に書く。
そのコードをすべて捨てて、最初からやり直す
512
(3): デフォルトの名無しさん [sage] 2014/12/26(金) 00:45:54.67 ID:bqhfMHzD(1/2) AAS
var i_want = "20141225"

function sn()
{
//要素の取得
  var str = document.getElementsByName("img src")[0];
//判定
  if( str.indexOf("i_want") >= 0 ){
//処理
location.replace("");
}
}

この場合のlocation.replace("")のURLの指定がいまいちわからないです…
そもそもこの書き方であってるかどうか不安なんですがアドバイスお願いしますorz
513
(5): デフォルトの名無しさん [sage] 2014/12/26(金) 02:23:12.85 ID:oJWcQfli(1) AAS
適当にググって入門サイト流し読みしてきたほうがいいと思う
要所だけ直すと、仮に一つ目のimg要素のsrc属性の値(URL)へ移動する場合は
var img = document.getElementsByTagName('img');
var src = img[0].src;
location.href = src;
516
(3): デフォルトの名無しさん [sage] 2014/12/26(金) 11:07:09.30 ID:GaLPZB3p(1/2) AAS
流れぶった切ってすまんなんだけど
プログラミング初心者におすすめの書籍、サイトを教えてください
ドットインストールは一通り見てきました
1-
スレ情報 赤レス抽出 画像レス抽出 歴の未読スレ AAサムネイル

ぬこの手 ぬこTOP 0.221s*