22/06/04 19:32:18.50 .net
どなたか教えてください。
<body>
<script>
var str = document.getElementById{"test").innerHTML;
str = str.replace(“やま”, “ほし”);
document.getElementById("test").innerHTML = str;
</script>
<div id=“test”>
<p>うみ</p>
<p>やま</p>
</div>
</body>
としてもブラウザーには
うみ
やま
と表示されてしまいます。
どこか間違っているのでしょうか？
その場合どこを直せばいいでしょうか。
よろしくお願いします。
254:Name_Not_Found
22/06/04 21:56:17.30 .net
釣られないぞ
255:Name_Not_Found
22/06/04 21:58:29.74 .net
>>253
ダブルクォートやカッコが間違ってる
scriptタグを</div>より後に
256:Name_Not_Found
22/06/04 22:01:16.83 .net
DOMがreadyになってから実行しろって話じゃないの？
257:Name_Not_Found
22/06/04 22:15:41.08 .net
みなさんレスありがとう。
()と”を’に置き換えて下記のようにしてみました
<div id=“test”>
<p>うみ</p>
<p >やま</p>
</div>
<script>
var str = document.getElementById('test').innerHTML;
str = str.replaceAll('うみ', 'ほし');
document.getElementById('test').innerHTML = str;
</script>
しかしブラウザでは うみ やま と表示され ほし やま になってくれません。
258:Name_Not_Found
22/06/04 22:44:00.21 .net
シングルクォートにしろという事ではなく全角ダブルクォートなのが間違い
<div id="test">
259:Name_Not_Found
22/06/05 07:14:56.13 .net
>>258
半角だと思うのですがこれじゃだめなんですね。
260:Name_Not_Found
22/06/05 07:20:42.56 .net
お騒がせしています
<div id="test">
<p>うみ</p>
<p >やま</p>
</div>
<script>
var str = document.getElementById("test").innerHTML;
str = str.replaceAll("うみ", "ほし");
document.getElementById("test").innerHTML = str;
</script>
このように書き換えましたがはやり うみ が やま に変わりません。
どこかどのようにだめなのかわかりませんか？
261:Name_Not_Found
22/06/05 07:25:18 .net
すみません。混乱していて。
うまく表示されていたようです。
初歩的な事にレスをいただいてみなさんありがとうございました。
感謝します。
262:Name_Not_Found
22/06/05 16:32:21 GSVgB4j6.net
const express = require('express');
const server = express();
と書いた場合と、express(); の前に new を付けて、
const express = require('express');
const server = new express();
と書いた場合、何が違うのでしょうか？
同じように動作しているように見えます。
263:Name_Not_Found
22/07/21 18:28:05 bVEASdty.net
こういう鍵盤をイメージしたボタンが複数60Keyほどあって、鍵盤のキーをクリックしたらイベントを開始したい。
<span class="white-key" data-key="90" data-note="1c"><i>ド</i></span>
<span class="white-key" data-key="88" data-note="1d"><i>レ</i></span>
<span class="white-key" data-key="67" data-note="1e"><i>ミ</i></span>
.
.
.
しかし、id属性がないので、
let button = document.getElementById('xxx');
button.addEventListener('click', butotnClick);
とは記述できない。
jQueryや、Reactや、Vue.jsなどは使わず記述する方法ありますか？
264:Name_Not_Found
22/07/21 19:17:04.35 .net
要素を取得する方法の問題？
id属性がなくてもwhite-keyクラスがついてるってわかってるなら
URLﾘﾝｸ(developer.mozilla.org)
を使えば要素の一覧が取得できる
265:Name_Not_Found
22/07/21 19:17:59.47 .net
>>263
classなりなんなり共通してる他の属性を使えばいい
document.querySelectorAll(".white-key, .black-key").forEach(elem => elem.addEventListener("click", buttonClick));
266:Name_Not_Found
22/07/21 19:28:53.96 .net
>>264,>>265
ありがとうございます。やってみます。この方法なら、keyごと（ボタンごと）に、
addEventListener()
つくらなくていいのかもしれないですね。
60個も、addEventListener()つくるのは面倒だなと思ってました。
267:Name_Not_Found
22/07/21 19:31:46.38 .net
あ。いや。ボタン毎にaddEventListener()記述しないと、同じ音が出てしまうな。。
268:Name_Not_Found
22/07/21 19:42:44.93 .net
繰り返しaddEventListenerでイベントハンドラ設定するのが嫌なら、
適当な親要素にイベントハンドラつけてそのイベントハンドラ内で
let button = event.target.closest(".white-key");
ってやればいいんじゃないかな
URLﾘﾝｸ(developer.mozilla.org)
269:Name_Not_Found
22/07/21 23:38:14 .net
こんな感じかね
URLﾘﾝｸ(jsfiddle.net)
270:Name_Not_Found
22/07/22 08:54:33.42 LPjEgNsv.net
フリーランス向けエージェント「クラウドテック」会員数8万人突破
～働きやすい環境構築のため、単価向上・全年齢の活躍の場創出・
地方企業のDX推進の取り組みを強化します～
フリーランスエンジニア専門の案件一括検索サイト「フリーランススタート」、
累計掲載案件数25万件突破！リモートワークの累計掲載案件数35,000件突破！
新規人材の80%がフルリモート希望！ IT人材市況動向レポート2021年12月版を公開
人口移動報告 家賃高い、首都圏脱出 「コロナ禍、仕事フルリモート」
クラウドテック、地方企業向け『クラウドテックDX』を開始、
7万人を超えるDX人材が、地方の非IT企業のDX推進を支援
新潟県、移住してきたテレワーカー／フリーランスに最大50万円を支給
テレワークの一般化により、11月にはテレワーク可能案件83.7%へと増加。
2021年、フリーランスのトレンドは「移住＆テレワーク」と予測
271:Name_Not_Found
22/07/22 15:02:06.74 .net
jQuery で、外側・親にイベントを付けて、親で子のイベントをキャッチする。
$( event.target )
<div id="btn-wrap">
<button class="BtnA BtnAll" value="1">A-1</button>
<button class="BtnA BtnAll" value="2">A-2</button>
<button class="BtnB BtnAll" value="3">B-3</button>
</div>
$( function ( ) {
// 外側・親にイベントを付けて、親で子のイベントをキャッチする
$( '#btn-wrap' ).on( 'click', function ( event ) {
const value = $( event.target ).prop( 'value' )
console.log( value )
} );
これで、1,2,3 などが出力される
272:Name_Not_Found
22/07/22 20:52:23.24 .net
なんでjQuery？
273:Name_Not_Found
22/07/22 21:45:39.09 .net
>268
>269
>271もかな。
ありがとうございます。
>269の発想はJavaScriptに慣れてないとできそうじゃないねえ。
勉強になりました。参考にさせていただきます。
274:271
22/07/22 23:10:42.75 .net
JavaScript は難しすぎる。
バグってばかりで、アホらしい
漏れは、Ruby, jQuery ぐらいしか書けない
275:Name_Not_Found
22/07/23 00:06:45.72 .net
言語とライブラリを混同してる時点で理解不足としか
276:Name_Not_Found
22/07/23 03:29:16.41 FClyRvyS.net
疑似的に、sablimeTextとか、VisualStudioCodeを模して
ソースコードに対して、キーワード毎に色付けるような、
javascriptのパッケージてないですか？
277:Name_Not_Found
22/07/23 04:01:34 .net
すいません。わかりづらいので修正。
ソースコードに対して×
htmlに書かれた、スニペットに対して〇
278:Name_Not_Found
22/07/23 13:09:05.45 .net
こういうの？
URLﾘﾝｸ(qiita.com)
279:Name_Not_Found
22/07/23 14:30:30.90 .net
ありがとうございます。まさにそれです。
280:Name_Not_Found
22/07/27 14:20:46.26 4QcDaVi1.net
これで音がなるのですが、zingle.mp3は１０秒程度の長さです。
３秒ぐらいで音をストップさせるにはどうすればいいですか？
const sound_c = new Audio('sound/zingle.mp3');
sound_c .play();
281:Name_Not_Found
22/07/27 14:34:05.59 .net
setTimeout()で解決しました。おさわがせしました。
282:Name_Not_Found
22/08/03 18:48:40 Nj6BOTMG.net
＜!DOCTYPE html＞
＜html＞
＜head＞
＜script type="text/javascript" src="URLﾘﾝｸ(code.jquery.com)＞＜/script＞
＜title＞サンプル＜/title＞
＜/head＞
＜body＞
＜input type="button" value="再生" id="button"＞
＜script＞
if ($('#button').val() === "再生"){
$('#button').click(function() {
console.log($('#button').val());
console.log($('#button').val() === "再生");
console.log("再生をはじめました。");
$('#button').val('停止');
});
}
＜/script＞
＜/body＞
＜/html＞
今すっごくハマっているところですが、input要素のvalue値を変化させると、ボタンをクリックさせないように設定しているのですが、
そんなの関係なしに、ボタンがクリックできてしまいます。
これは、どういった理由で変な処理が可能になっているのでしょうか？今後ハマらないためにどのような注意をすればよいでしょうか？
283:Name_Not_Found
22/08/03 20:01:54.34 Nj6BOTMG.net
＜!DOCTYPE html＞
＜html＞
＜head＞
＜script type="text/javascript" src="URLﾘﾝｸ(code.jquery.com)＞＜/script＞
＜title＞サンプル＜/title＞
＜/head＞
＜body＞
＜input type="button" value="再生" id="button"＞
＜script＞
var playing_flag = false;
if (playing_flag === false){
$('#button').click(function() {
console.log('ボタンが押された');
console.log(playing_flag);
$('#button').val('演奏中止');
playing_flag = true;
console.log(playing_flag);
// run();
});
}else{
console.log(playing_flag);
// reset();
}
＜/script＞
＜/body＞
＜/html＞
flag用の変数を使ってもダメだった。どこで躓いているんだろ。。
284:Name_Not_Found
22/08/03 20:12:43.40 .net
こういうこと？
ボタンを無効化させる意図がよく分からんけど
disableかstyleのpointer-eventかければいいだけかと
URLﾘﾝｸ(i.imgur.com)
285:Name_Not_Found
22/08/03 20:17:43.28 Nj6BOTMG.net
もちろん、もともとの目的は無効化なんだけど。
それより、
if(false){
実行A
}
の状態なのに、実行Aが実行されているのが気になって。
286:Name_Not_Found
22/08/03 20:22:18.94 .net
false === false は真だろ
287:Name_Not_Found
22/08/03 20:23:51.02 Nj6BOTMG.net
お。
288:Name_Not_Found
22/08/03 20:27:15.89 .net
そっかー。ありがとう。これに２時間悩んでたww
289:Name_Not_Found
22/08/03 20:32:11.88 Nj6BOTMG.net
いや。解決してない。
290:Name_Not_Found
22/08/03 20:36:38.79 Nj6BOTMG.net
＜script＞
var playing_flag = false;
if (playing_flag === false){
$('#button').click(function() {
console.log('ボタンが押された');
console.log(playing_flag);
$('#button').val('演奏中止');
playing_flag = true;
console.log(playing_flag);
// run();
});
}else{
console.log(playing_flag);
console.log('2回目はこっちが押されるはずでは？');
// reset();
}
＜/script＞
１回目のクリックは、if文の実行で問題ないのだけど。
２回目のクリックは、else文を実行するのでは？
291:Name_Not_Found
22/08/03 20:48:32.41 Nj6BOTMG.net
＜input type="button" value="再生" id="button">
＜script>
var playing_flag = false;
const btn = document.getElementById("button");
var run = () => {
console.log(playing_flag);
console.log("再生中");
playing_flag = true;
};
var reset = () => {
console.log(playing_flag);
console.log("停止");
playing_flag = true;
};
if (playing_flag === false) {
btn.addEventListener("click", run, false);
} else {
btn.addEventListener("click", reset, false);
}
＜/script>
jQueryが悪いのかと思って、イベントリスナーでクリックしてみたけど。
やっぱり２回目のクリックでelse文を実行しない。
なんか、おれ勘違いしてる？？？？
292:Name_Not_Found
22/08/03 20:52:18.36 Nj6BOTMG.net
ちょっと訂正。
var reset = () => {
console.log(playing_flag);
console.log("停止");
playing_flag = true;
};
↓
var reset = () => {
console.log(playing_flag);
console.log("停止");
playing_flag = false;
};
293:Name_Not_Found
22/08/03 20:53:44.88 .net
その2回通ると思い込んでるif文はイベントハンドラでも何でもないんだからボタン押される前の１回しか通らないよ
294:Name_Not_Found
22/08/03 21:00:45.56 Nj6BOTMG.net
え。意味がよくわからない。イベントハンドラじゃないから、１回しかとおらない。。？？
295:Name_Not_Found
22/08/03 21:13:35.85 Nj6BOTMG.net
ずっとコードを眺めてみたら、
>>290のコードは確におかしいことは分かってきた気がする。
296:Name_Not_Found
22/08/03 21:37:07.14 .net
>>291,292のコードも、イベントリスナー使ってますけど。
２回クリックしてもelse文にはならず、if文を２回実行しているのでしょうか？
297:Name_Not_Found
22/08/03 21:56:45.64 Nj6BOTMG.net
playing_flag = false;
var run = () => {
if(playing_flag === false){
console.log(playing_flag);
console.log("再生中");
playing_flag = true;
}else{
reset();
}
};
var reset = () => {
console.log(playing_flag);
console.log("停止");
playing_flag = false;
};
const btn = document.getElementById("button");
btn.addEventListener("click", run, false);
納得いかないけど、>>291,292を上のように変えたら、
期待した通りに動いた。
ボタンの状態に、フラグをつけて、実行に条件を入れるときは注意しないと
いけんのかもなあ。
298:Name_Not_Found
22/08/03 22:04:04.33 .net
納得いかない、ねえ？
開発者ツールでどういう順番でどの行の処理がされるか確認したらいいんじゃないかな
299:Name_Not_Found
22/08/03 22:07:55.84 Nj6BOTMG.net
あ。そうですね。アドバイスありがとうございます。
300:Name_Not_Found
22/08/03 22:12:13.92 .net
>>297
むしろ、>>291でフラグ立ててイベントハンドラ振り分けてるのが最高に意味不明なんだが
イベント駆動について勉強してみたら？
301:Name_Not_Found
22/08/03 22:42:39.79 Nj6BOTMG.net
よくわかってなかったようだ。
下の認識でOKですか？雑ですが。。
「Javascriptはブラウザが開いたとき、上の行から下の行へ基本一回だけ実行する。
しかし、イベントが起きたら例外的にその箇所を実行する。」
302:Name_Not_Found
22/08/04 02:45:36.83 .net
>>301
HTMLスクリプト要素のdefer属性(DOMContentLoadedからの実行)とasync属性(HTMLScriptElement#onloadからの非同期実行)
303:Name_Not_Found
22/08/04 03:10:03.94 jGEKnkMs.net
>>302ありがとうございます。詳しく調べてみます。
>>291,292を
開発者モードでトレースしてみたのですけど。
ボタンをクリックすると、直前の条件の評価をせずに、
いきなりrun()の中を実行はじめました。
カレントの変数を無視して、初回時の条件が適応されているようです。
多分。疑問に思う方が変なのかもしれませんが、これは慣れですかね。。
304:Name_Not_Found
22/08/04 03:13:38.61 .net
例えば、HTMLスクリプト要素にasync属性が指定してあると、次の二つは共に実行されない。
new Promise(addEventListener.bind(this, 'DOMContentLoaded')).then(e => console.log(e));
await new Promise(addEventListener.bind(this, 'DOMContentLoaded')).then(e => console.log(e));
例えば、次は1回クリックしたら次は無い。
new Promise(document.addEventListener.bind(document, 'click')).then(e => console.log(e));
>>301
これら当たり前過ぎる例を説明できますか？
今のJSは巨大なフレームワーク、1997年レベルから2022年レベルにするの大変だろうけど頑張ってね。
305:Name_Not_Found
22/08/04 23:22:36.77 .net
>>297
>var playing_flag = false;
>if (playing_flag === false){ 処理 }
playing_flag が真偽値・bool 型なら、単にこう書けば？
if ( playing_flag )
基本、boolを比較してはならない。
すでに、boolになっているから
306:Name_Not_Found
22/08/04 23:38:01.22 .net
jQuery のon で、任意の要素に、任意のイベントを追加できる
<button id="btn_1" class="btn btn-primary">
<span class="show-when-enabled">送信</span>
<span class="show-when-disabled">送信中...</span>
</button>
<button id="btn_2">送信ボタンをenable にする</button>
<style>
button .show-when-enabled { display: initial; }
button[disabled] .show-when-enabled { display: none; }
button .show-when-disabled { display: none; }
button[disabled] .show-when-disabled { display: initial; }
</style>
$( function ( ) {
$( '#btn_1' ).on( 'click', function ( event ) {
$( this ).prop( 'disabled', true ); // disable にする
} );
$( '#btn_2' ).on( 'click', function ( event ) {
$( '#btn_1' ).prop( 'disabled', false ); // enable にする
} );
} );
307:Name_Not_Found
22/08/05 02:46:29.55 .net
もうjqueryスレと統合すべきだと思うの
両者の関連スレ合わせても勢い1すらないんだし
308:Name_Not_Found
22/08/05 07:46:34.74 .net
jqueryを使わずにpure jsで、ていう質問も大いにありえるから
分けたほうがいいとおも
309:Name_Not_Found
22/08/05 08:20:20.41 .net
JSスレはプログラム板のスレもあるんだよなあ
既にどちらも人がいないし、今から整理するのは無理そう
+ JavaScript の質問用スレッド vol.124 +
ｽﾚﾘﾝｸ(tech板)
310:Name_Not_Found
22/08/05 08:35:50.13 .net
どっちでも良い。
答える方としては、素のJS で書くのは非常に面倒
jQuery は可読性が高いので、読めない香具師はいないから、
ひとまず、jQueryで書いて、
それを質問者が書き直したければ、素のJSで書き直せばよい
311:Name_Not_Found
22/08/05 11:51:55.86 .net
jQueryスレやプログラム板でもいわれてるが、今は統合とかテンプレ修正とか、意欲ある人がいない
+ JavaScript & jQuery 質問用スレッド vol.7 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(hp板:683番)-687
+ JavaScript の質問用スレッド vol.124 +
ｽﾚﾘﾝｸ(tech板:253番)
>>307も統合を示唆してるが、「やりたいなら、お前が責任持ってやれ」といわれてもやらないだろ？
昔の風潮なら俺も手を貸しただろうが、今はやる気が全く起きないわ
まともな感性で保守する人は皆無だし、jQuery信者は健在だし、俺一人でどうにかなる問題でもないからな
312:Name_Not_Found
22/08/05 12:17:08.84 .net
jQueryスレはタイトル詐欺だから「jQuery質問用スレッド」にして
jQuery使わない人が迷い込まないようにすれば万事解決
313:Name_Not_Found
22/08/05 17:47:44.84 .net
>>312
リンク先をよく読め
jQueryスレは既にある
+ jQuery 質問用スレッド vol.7 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(hp板)
314:Name_Not_Found
22/08/05 19:12:45.74 .net
>>313
じゃ、タイトル詐欺スレを削除すれば解決だね
315:Name_Not_Found
22/08/21 11:50:33.80 5ThV/pZE.net
【環境】iOS Catalina 10.15.7,GoogleCrome104.0.5112.101
【何をしたのか】Editor.jsでデータを受け渡す方法について知りたいです。
【エラーメッセージ】そもそも方法がわからないのでエラー等は発生してません。
【期待する結果】Editor.jsで入力したデータを次のページで内容チェックし、更にMySQLへ登録したい。また、記事の編集の際にはMySQLからデータを読み出し、Editor.js上で編集したい。
【サンプルコード】このサイトとまったく同じ状態です。URLﾘﾝｸ(reffect.co.jp)
勉強のため自作のブログ投稿用CMSを作成しています。
formとphpで基本的な記事投稿（入力→実際の表示確認→MySQL登録）、記事の再編集（MySQLからのデータ読み込み→投稿フォームへの再表示→編集→MySQL更新）は完成しました。
ただ、現状では画像や表、リストなどを挿入するときにいちいちhtmlタグを入れなければいけないことから、WYSIWYGのひとつEditor.jsを使ってタグを自動生成したいと思っています。
phpのときには教科書どおりinputにnameをつけてPOSTでデータを受け渡してましたが、Editor.jsではdivにテキストエディタを表示させることから、どうやってデータを受け渡すのかつまずいています。
上記サイトではボタンを押すとconsoleに取得データを表示していますが、ボタンを押すと実際の記事表示を確認できるようにしたいと思っています。
どのようなやり方があるでしょうか。お力を貸してください。
316:Name_Not_Found
22/08/21 16:41:06.34 .net
>>315
console.logする代わりにデータ(JSON)を確認画面に渡して
確認画面側でEditorJSをreadonlyで表示するか
同じ画面でreadonly viewとedit viewとtoggleさせる(EditorJSのreadonly.toggle)
サーバーにPOSTするのはJSON
317:Name_Not_Found
22/08/22 08:46:09.58 .net
Ruby on Rails では、WYSIWYG エディターは、
Railsの作者・DHH の会社である、Basecamp 製のtrix を使う
318:Name_Not_Found
22/08/27 23:04:43.45 .net
もう終わりだよこの板も
319:Name_Not_Found
22/08/28 14:19:06.39 .net
JavaScriptスレは荒らされる前は平和だったんだけどね
今は見る影もない
320:Name_Not_Found
22/08/28 21:46:17.13 .net
今何とか機能してるのって愚痴スレとHTMLCSS質問スレとPHP質問スレがギリギリって感じか
語ることなんて特にないし仕方ないね
321:Name_Not_Found
22/08/31 23:57:52.92 .net
>>320
PHPも死んでね？
322:Name_Not_Found
22/09/01 22:47:44.67 .net
HTMLスレは板基準にすれば進んでるよなぁ
まあ最初にやるのがそれってのもあるけど。
初学者がくるようになればこっちも盛り上がるんだろうな？なるよな？
323:Name_Not_Found
22/09/01 23:34:56.25 .net
正直調べりゃ分かるからこっちに書き込むエネルギーなんて一々使わないだろってとこは思ってる
jsまで興味を持ったのなら調べるスキルっつーか知識欲も持ち合わせてるだろうし
その結果がこれよ
324:Name_Not_Found
22/09/02 00:35:32.25 .net
>>321
PHPの質問スレは板が違う
まあ向こうも同じようなもんだけど
325:Name_Not_Found
22/09/02 01:00:03.80 .net
javascriptもPHPもオワコン。
そしてプログラミングの初学者には難しすぎる
初心者はRubyから学習を始めるべき。
そしてRuby on Railsを習得すればPHPは不要
こっちのスレで質問すれば親切な達人プログラマーがどんな質問にも懇切丁寧に答えてくれる。
↓
Ruby 初心者スレッド Part 67
ｽﾚﾘﾝｸ(tech板)
326:Name_Not_Found
22/09/02 09:40:03.86 .net
>>325
ｽﾚﾘﾝｸ(tech板:512番)
> 512 デフォルトの名無しさん (ﾜｯﾁｮｲ 027c-5Ix7) sage 2022/08/19(金) 13:31:40.23 ID:Gwz5c/EG0
> Rubyガイジがこのスレに誘導しているみたいだけど
> 今更Rubyなんて流行らないし>>503でも指摘されているけど
> 新規案件でRubyやRailsなんて採用しないから初心者が勉強するだけ無駄だぞｗ
327:Name_Not_Found
22/09/06 13:50:31.39 .net
RUNTEQ
【知らないと転職無理】未経験エンジニアの疑問全て回答！
www.youtube.com/watch?v=5IzjaC6vEg0
この動画では、Ruby on Rails から始めろと言っている
ウェブ系で最も使われているフレームワーク。
スタートアップでよく使われる
高速開発で、日本語の情報が多い
328:Name_Not_Found
22/12/29 12:19:48.08 .net
JSで「日付が変わると自動で音が鳴る」というものを作りたいです。
329:Name_Not_Found
22/12/29 14:40:03.89 .net
どうぞどうぞ
330:Name_Not_Found
23/01/01 04:14:06.90 .net
>>328
すいません
JavaScriptで日付が変わると自動で音が鳴るというものを作るにはどうしたらいいですか？
331:Name_Not_Found
23/01/01 04:55:49.86 vLbVtKKA.net
>>330
このスレじゃ無理
こっちのスレで質問してみよう。親切な達人プログラマーが懇切丁寧に教えてくれるよ
Ruby 初心者スレッド Part 67
ｽﾚﾘﾝｸ(tech板)
332:Name_Not_Found
23/01/01 13:49:46.89 .net
>>331
Rudyって何ですか？
333:Name_Not_Found
23/01/01 16:22:43.15 .net
>>331
イタズラ乙
ｽﾚﾘﾝｸ(tech板:593番)-594
334:Name_Not_Found
23/01/02 18:52:30.50 .net
>>325,331
4ヶ月前もRuvyスレ移行で受け入れられなかったのに、懲りない人だね
335:Name_Not_Found
23/01/03 15:44:37.55 .net
画面遷移に伴って、リクエストヘッダを追加したいときどうすればいいか教えてください。
・１ サーバサイドで「Location」レスポンスヘッダを指定してリダイレクトさせるときに、
リダイレクト先アクセスにリクエストヘッダを添付させることは可能ですか？
・2 ブラウザ側で画面遷移するときに、リクエストヘッダをつけることは可能ですか?
<a>タグ、JavaScriptの「location.href」にリクエストヘッダ追加できますか？
・3 同じく<form>を飛ばすときにリクエストヘッダ付けられますか？
(補足)リクエストヘッダをつけるときに、思い浮かぶのはAjax, XHRを使うことですが、
これを使うと画面遷移は伴いません。
OAuthの勉強をしていて、アクセストークンをブラウザで保持して、それをAuthorizationヘッダーに
添付しないといけないことが分かったので、それをどうやってリクエストヘッダにセットするのかを調べています。
もしあるなら、その実装方法が載っているサイトが見つからなかったので教えてください。
336:Name_Not_Found
23/01/03 15:59:37.14 .net
>>335
これを質問した者と同じ者ですが、解決方法が分かったかもしれないので書きます。
まず一度、認証情報なしでアクセスすると、
サーバ側が「401: Authorization Requed」ステータスを返してきて、
そこに「WWW-Authenticate」というレスポンスヘッダで認証が必要である指定が返ってくるので、
それが返ってくるとブラウザは自動でAuthorizationヘッダをセットして再アクセスするので、
サーバサイドは、401を返して、WWW-Authenticateヘッダをレスポンスするように実装しておいて、
一度401でわざと失敗させればよいため、最初から自分でAuthorizationヘッダを添付しなくてもいいのかもしれません。
しかし、ブラウザはそれで自動的に正しいアクセストークンを選んでくれるのでしょうか？
認証サーバ(IdP)から払い出されたアクセストークンをブラウザのローカルストレージか何かに保存しとくと思いますが、
それを適切に選んでくれるかが心配です。
337:Name_Not_Found
23/01/03 16:25:07.78 .net
リダイレクト時にカスタムヘッダーを追加するのは無理
ブラウザがローカルストレージから自動的に特定のアクセストークンを取得してヘッダーに追加するようなことがあればセキュリティ的に大問題なのでこれも無理
(カスタムヘッダー無しのCookieだけでいいなら可能)
XHRで取得したレスポンス使ってクライント側JavaScriptで画面を更新する他ない
338:Name_Not_Found
23/01/03 16:31:47.61 .net
>>337
そのクライアント側JavaScriptで画面を更新するときに、
Authorizationヘッダーを要求されませんか？
そもそも、アクセストークンを要求するのはデータ取得用のAPIだけにとどめておいて、
画面を描画するようなURLに対してアクセストークンを要求してはいけないということでしょうか？
339:Name_Not_Found
23/01/03 23:40:35.44 .net
最近までAuthorizationヘッダーがそのままリダイレクトされてたみたいｗ
URLﾘﾝｸ(github.com)
HTTPの仕様的にはAuthorizationは削除したほうがいい的なことを書いてるのに・・・
Consider removing header fields that were not automatically generated by the implementation (i.e., those present in the request because they were added by the calling context) where there are security implications; this includes but is not limited to Authorization and Cookie.
URLﾘﾝｸ(www.rfc-editor.org)
340:Name_Not_Found
23/01/04 00:34:28.00 .net
Ruby on Rails では、Turbolinks を使って、
pjax(ajax と、historyAPI(popState, pushState))を利用して画面遷移する。
通信データを減らすために、body 部分しか変わらない
認証は、退屈な雛形を自動生成する
github.com/abhaynikam/boring_generators
Devise とか、Devise Omniauth(Facebook, GitHub, Google, Twitter)
一番分かりやすい OAuth の説明
qiita.com/TakahikoKawasaki/items/e37caf50776e00e733be
基本、日本の未経験者用のバックエンドで採用しているのは、
YouTube で有名な雑食系エンジニア・KENTA の言う通り、Rails優先
341:Name_Not_Found
23/01/04 20:25:37.82 afahpZwg.net
>>339
XHRで非同期でリクエストヘッダを付けてサーバへ送信すると
サーバサイドでLocationヘッダーでリダイレクトすると次のリクエストにも暗黙的に前のリクエストヘッダーが引き継がれるのか？
なかなか複雑だな。
だけどXHRでリダイレクトが帰ってきても自動的には画面遷移しない。
ブラウザ側でlocation.hrefしないと画面遷移しないがこの時はさすがに非同期の戻りのリクエストヘッダは引き継げないだろ。
それと、クロスオリジンでリダイレクトする時もリクエストヘッダー引き継がれるの？
342:Name_Not_Found
23/01/09 18:06:47.49 .net
初学者の者です
「Pixiv Filter」というChromeの拡張機能の話なんですけど、この拡張機能の一つに、Pixivの検索結果画面で、イラストごとの割り振られたタグを、本来は表示されない検索結果の画面で表示してくれるというものがある
この機能なんだけど、コード（GitHubで公開されている。URLはスパム対策で貼れない、申し訳ない）を読んでも仕組みがどうにも理解できなかった。
「イラストのURLに飛んで、そこからリンクを取得してくる」といったものかとも思ったが、どうやら違う模様
詳しい方いらっしゃったら、ご教授頂きたいです
343:Name_Not_Found
23/01/09 19:33:20.74 .net
ざっと見たところ
・作品ごとのタグは検索結果画面には表示されないものの検索結果データとして飛んできている
www.pixiv.net/ajax/search/artworks/***のリプライ内のdata[].tags[]という配列がそれ
・バックグラウンドで取得し直してそれをストレージに格納している
background.tsの123行目あたり
type.d.tsのWorksData型にtags配列あり
・検索画面にそれを表示している
search_page.tsの97行目あたり
実際に拡張機能入れて動かしたわけでもないしソース追っただけだから適当だけど
344:Name_Not_Found
23/01/09 21:27:33.60 .net
>>343
ご教授感謝です、参考にさせて頂きます
345:Name_Not_Found
23/01/10 01:47:07.95 .net
ちょっとしたデータを取得するのに、
「イラストのURLに飛んで、そこからリンクを取得してくる」みたいな、
副問い合わせをやっていたら大変
346:Name_Not_Found
23/01/11 00:32:53.42 dBdRyffW.net
>>345
ですよね…なんかちょっと変かな？という気はしていました、ありがとうございます
「API」とか「ストレージ」「トークン」「クッキー」みたいな通信の部分がからっきしなもので、色々調べながらやらせて頂きます
347:340
23/01/11 04:43:41.70 .net
漏れらだって、Ruby on Rails, Linux, Docker, AWS Solution Architect しか分からない
>>340
に書いたように、誰かが作った、退屈な雛形を自動生成して作っている
CSRF, Strong Parameter, pjax, place holder、データベースの設計など、
全部Railsで勉強しているだけ
348:Name_Not_Found
23/01/11 11:01:19.44 .net
>>346
察するにその拡張機能を調査分析するのに必要なスキルがまだ足りてないから
もう少し基礎知識を身につけてから挑んだ方がいいと思うよ
分不相応な挑戦は時間のムダにしかならない
あとRailsはNGワードに入れといた方がいい
349:Name_Not_Found
23/02/21 11:34:13.09 .net
cssファイルのセレクタに、別のjsonファイルの値をインポートして使える方法とかありませんか？
【jsonファイルの値】{color:green;}
みたいな。
350:Name_Not_Found
23/02/22 02:42:08.74 .net
sassファイルに、jsonファイルの読み込みとかってできたりする？
351:Name_Not_Found
23/03/24 07:50:31.37 ornKmOPA.net
コードを1人で書いてます。他人が見ることは100%ありません。
(a) function hoge(){ }
(b) var hoge = function(){ };
の区別や管理はどうしてますか？
・返り値のないものはa、あるものはb
・宣言のみは冒頭、実行の伴うものは後述
というルールで書いていましたが、
1万行近くなって見通しよくするために大まかな機能ごとにまとめるようになり
bが順序的に後述になる箇所が出てきました。
”機能ごと”は今後順序変更する可能性があります。
関数リテラルのメリットがいまいちわかりません。どんなメリットがあるのでしょうか？
また返り値有無関係なく全てaにして不便はありますか？
352:Name_Not_Found
23/03/24 18:33:56.71 .net
>>351
不便はありません
動的に変数の中身の関数を入れ替えたい場合だけ(b)で
353:351
23/03/24 22:38:34.30 .net
>>352
動的に全く違う関数に入れ替えられるのですね、なるほどです。
この件では各関数や引数の目的が明確固定ばかりなのでその場合はなさそうです。
極一部名前付き引数を使用していますが、関数内処理はほぼ一定で、その程度です。
ありがとう。
354:Name_Not_Found
23/03/25 00:37:00.35 .net
このJavascriptでdivをタブで切り替え表示のサンプルで
Works、Contactタブにimg srcで画像を埋め込んでた場合
Works、Contactタブを選んだ時にだけ画像や内容を読み込む動作ってどうやるの
URLﾘﾝｸ(posipan.com)
355:Name_Not_Found
23/03/25 19:04:37.36 .net
Lazyloadとか使うといいかと
356:Name_Not_Found
23/03/27 10:49:47.68 .net
>>351
細かい話をするとb自体は関数式であって関数リテラルというのはbの右辺を指す用語
aとbの違いについてはこのへんを参照のこと
URLﾘﾝｸ(developer.mozilla.org)
あと個人的な感覚としては返り値の有無で区別をするのはナンセンスだと思う
357:Name_Not_Found
23/03/27 13:58:05.40 .net
そんな自分のウンチク言ってないで質問に答えてやればいいのに
358:Name_Not_Found
23/03/27 20:31:02.45 .net
なんで上から目線で「質問に答えてやればいいのに」といえるのだろう？
359:Name_Not_Found
23/03/28 01:36:21.08 .net
なんか癪に障っただけだろう
360:Name_Not_Found
23/03/28 16:35:38.31 .net
>>358
何一つ答えてないからじゃね
361:Name_Not_Found
23/03/28 17:07:37.33 .net
>>360
それは上から目線である理由になってないね
>>358が聞きたいのはそっちだろう
362:Name_Not_Found
23/03/28 19:26:10.85 .net
上から目線を感じてしまうのはあなたが小さい人だからよ
363:Name_Not_Found
23/03/28 21:03:37.18 .net
>>356にケチつけるのと似たりよったりだね
364:Name_Not_Found
23/03/28 21:15:19.17 .net
356はケチつけられても仕方ない
回答もせず、どうでもいい知識自慢、「このへんを参照のこと」なんて上から目線、自己主張
362の通り気にしすぎ
365:Name_Not_Found
23/03/28 21:23:34.93 .net
争いは同じレベルでしか発生しない
366:Name_Not_Found
23/03/28 21:47:39.32 .net
>>364が気にし過ぎでﾌﾌｯてなる
なるほど同レベルだね
367:Name_Not_Found
23/03/28 22:28:03.56 .net
以前はスコープの問題でfunction expression派のライブラリが数多くあった
strict modeができてからはfunction declaration派が増えたように思う
368:Name_Not_Found
23/03/28 22:43:12.53 .net
>>366
356本人？負け惜しみ？
369:Name_Not_Found
23/03/28 22:45:04.76 .net
半角カタカナｗ
370:Name_Not_Found
23/03/28 23:05:22.37 .net
>>368
気にしすぎですよ
371:Name_Not_Found
23/03/29 17:51:02.44 .net
MathJaxってVer3になって、レンダリングされた文字列を範囲選択出来なくなった?
372:Name_Not_Found
23/03/31 12:07:44.93 .net
こんにちは。
どなたか教えていただけませんか。
下記のようなコードを書いたのですが、
div部分が1つなら問題ないのですが、複数になると2つ目以降は反映されません。
そこでループにしないといけないのかな？と思うのですが知識が未熟でどうすればいいのか全くわかりません。
どなたかどうすればいいか教えて頂けませんでしょうか。
よろしくお願いします。
// HTML
<div class="fullimg"><img src="./img1.jpg" height="1000" width="1000"></div>
<div class="fullimg"><img src="./img2.jpg" height="500" width="500"></div>
// script
let imgd = document.querySelector("img");
let result = imgd.getAttribute("src");
let hresult = imgd.getAttribute("height");
let wresult = imgd.getAttribute("width");
const div = document.getElementsByClassName("fullimg");
div[0].innerHTML = '<label for="' + result + '"><img src="' + result + '" height="' + hresult + '" width="' + wresult + '"></label>';
373:Name_Not_Found
23/03/31 13:50:56.44 .net
ループ以前にlabelのfor属性は関連するフォーム要素のIDを指定するものなので生成しようとしてるhtml自体に問題があるよ
374:Name_Not_Found
23/03/31 14:25:37.98 .net
では再度サンプルコードを書いておきます。
// HTML
<div class="fullimg"><img src="./img1.jpg" height="1000" width="1000"></div>
<div class="fullimg"><img src="./img2.jpg" height="500" width="500"></div>
// script
let imgd = document.querySelector("img");
let result = imgd.getAttribute("src");
let hresult = imgd.getAttribute("height");
let wresult = imgd.getAttribute("width");
const div = document.getElementsByClassName("fullimg");
div[0].innerHTML = '<img src="' + result + '" height="' + hresult + '" width="' + wresult '">';
こちらでどうぞよろしくお願いします。
375:Name_Not_Found
23/03/31 17:01:16.18 .net
>>372
せめてループに挑戦してるけどうまく動かないから助けてってとこまではたどり着いてほしい気がするなぁ
初心者向けのループのレクチャーなんていくらでも見つかるわけだし
376:Name_Not_Found
23/03/31 22:42:19.54 .net
>>375
どこかから拾ったサンプルコードの修正依頼で自分は全く知識がないのだろう
377:Name_Not_Found
23/04/01 12:28:09.62 .net
これで音信不通になるようではな
諦めたか他所へマルチしに行ったか
378:Name_Not_Found
23/04/01 14:29:48.39 .net
これは、取得した値をそのまま設定しているだけだから、何も変わらない
jQuery なら、
// fullimg クラスの付いたdiv の、直下のimg
$( 'div.fullimg > img' ).each( function ( index, elem ) {
jQ_this = $( this )
const src = jQ_this.attr( 'src' ) // 取得
const height = jQ_this.attr( 'height' )
const width = jQ_this.attr( 'width' )
console.log( `${ index }: ${ src }, h: ${ height }, w: ${ width }` )
jQ_this.attr( 'src', src ) // 設定
jQ_this.attr( 'height', height )
jQ_this.attr( 'width', width )
} )
ログ出力
0: ./img1.jpg, h: 1000, w: 1000
1: ./img2.jpg, h: 500, w: 500
379:Name_Not_Found
23/04/01 15:06:47.33 .net
jQuery信者が喜ぶネタなんだな
380:Name_Not_Found
23/04/03 20:28:44.17 .net
【環境】VS Code
バージョン: 1.77.0
Electron: 19.1.11
Chromium: 102.0.5005.196
Node.js: 16.14.2
V8: 10.2.154.26-electron.0
OS: Linux x64 5.4.0-42-generic
【何をしたのか】イベントリスナー内でevent.target.valueを参照した。
【エラーメッセージ】プロパティ 'value' は型 'EventTarget' に存在しません。ts(2339)
【サンプルコード】
(() => {
"use strict";
const fruit = document.querySelector('select');
if (null === fruit) { return; }
fruit.addEventListener('change', (event) => {
if (null === event.target) { return; }
console.log(event.target.value);
});
})();
fruit === event.targetを実行するとtrueが返ったので、event.target.valueをfruit.valueに書き換えたところエラーが消えた。
イベントを扱うサンプルコードでは大抵event.target.valueが利用されているが、HTMLSelectElement.valueで置換した場合に何か落とし穴はありますか。
381:Name_Not_Found
23/04/03 21:47:26.64 .net
>>380
エラーが消えたからヨシ！は好ましくない
まずはts(2339)で検索してみよう
382:>>380
23/04/03 22:22:25.06 .net
>>381
エディタ上でts(2339)が出ていてもブラウザ上での実行は問題なくできます。
キャストするとts(2339)が消えますが、「型アサーション式は TypeScript ファイルでのみ使用できます。ts(8016)」が発生します。
ブラウザで実行すると、「Uncaught SyntaxError: Unexpected identifier 'as' (at hoge.html:24:35)」が発生します。（TypeScriptの構文なので当然ですが……）
fruit === event.target;はtrueなので置き換えたのですが、トラップや問題はありますか。
（エディタ上のts(2339)も消えるし実行もできるので、落とし穴がなければこれで行きたいな、と）
383:Name_Not_Found
23/04/03 22:36:04.36 .net
>>382
そもそもTypeScriptを書こうとしてるわけじゃないのになんでtsエラーが出てるの？ってこと
vscode右下の言語モードがTypeScriptになってるんじゃないの？
384:Name_Not_Found
23/04/03 23:01:10.11 .net
>>383
なってないです。拡張機能も無効です。
i.imgur.com/TE6gwcY.jpg
385:Name_Not_Found
23/04/03 23:26:56.16 .net
>>384
うちではTSでは出るけどJSでは出ない
URLﾘﾝｸ(i.imgur.com)
URLﾘﾝｸ(i.imgur.com)
おそらく何かvscode側の問題だろう
で、エディタの問題ならなおさらfruit.valueで解決とするのは悪手
386:Name_Not_Found
23/04/03 23:39:06.45 .net
>>384
わかった、vscodeの設定に↓があるんじゃない？
"js/ts.implicitProjectConfig.checkJs": true
これ追加したらうちでもJSでエラー出た
387:>>380
23/04/03 23:48:50.00 .net
>>385 >>380
原因が判明しました。"js/ts.implicitProjectConfig.checkJs"がtrueでした。
型のチェックはしたいので、event.target.valueの上に@ts-ignoreを書いて解決します。
ありがとうございました。
388:>>380
23/04/03 23:51:00.10 .net
>>386
まさにそうでした。ありがとうございました。
389:Name_Not_Found
23/04/04 00:27:18.41 .net
jQuery では、event.target.value でも、正常に動く
<div id="btn-wrap">
<button class="BtnA BtnAll" value="1">A-1</button>
<button class="BtnA BtnAll" value="2">A-2</button>
<button class="BtnB BtnAll" value="3">B-3</button>
</div>
<div id="btn-wrap-2">
<button class="BtnC BtnAll" value="11">C-11</button>
</div>
$( function ( ) {
// 外側・親に、イベントを付けて、親で、子のイベントをキャッチする
$( '#btn-wrap' ).on( 'click', function ( event ) {
const value = $( event.target ).prop( 'value' )
console.log( value )
alert( value )
} );
$( '#btn-wrap-2' ).on( 'click', function ( event ) {
console.log( event.target.value )
alert( event.target.value )
});
} );
390:Name_Not_Found
23/04/04 00:53:07.21 .net
>>387
@ts-ignoreもなんか負けたみたいでいやだけども調べてみてもいい解決策はなさそう
致し方なしかな
>>389
正常に動くかどうかの話はしてないよ
よく読もう
391:Name_Not_Found
23/04/04 10:04:45.82 .net
fruitがHTMLSelectElementなのは確定してるから
event.currentTargetがHTMLSelectElementであることは推定できそうだな
event.target じゃなくて event.currentTarget にしたらどうなるかね
392:Name_Not_Found
23/04/04 10:48:34.90 .net
>>387
型チェック入れるとか
if (null === event.target || !(event.target instanceof HTMLSelectElement)) { return; }
キャストするとか
console.log(/** @type {HTMLSelectElement} */ (event.target).value);
393:Name_Not_Found
23/04/04 11:43:11.41 .net
>>392
そのへん少し試したけどうまくいかなくて諦めてた
致し方なしとか言う前にもう少し手を尽くすべきだった
反省
394:>>380
23/04/04 19:16:22.79 .net
>>391
currentTargetもts(2339)が発生します
>>392
元々、nullチェックは'event.target' は 'null' の可能性があります。ts(18047)のエラーを消すために入れていたのですが、
条件を!(event.target instanceof HTMLSelectElement)に書き換えてもts(18047)とts(2339)は発生しないので、解決しました。
JSDocコメントでのキャストは気づきませんでした、こちらが適している場面があればこちらも利用していきます。ありがとうございました。
>>390 >>393
そうなんです、@ts-ignoreを使用している行で他のエラーが出た時に気づけなくなるので、あまり使用したくないです。
遅い時間までお付き合いいただき、ありがとうございました。
ところで、event.targetの代わりにfruitを使用すべきではない明確な理由はないが、event.targetを使用するのが(通常|普通|無難)である。ということで合っていますか。
395:Name_Not_Found
23/04/04 22:54:34.70 .net
1つのイベントハンドラが複数の要素に対して設定されることは一般的で、その場合はevent.targetを使うことになる
今回のケースはそうでないにしても、可搬性や拡張性を考えれば常にevent.targetを使用しておくという判断は妥当だろう
あと処理結果は同じでも、イベントの起こった要素に対して処理をする、という意図をコードに残す意味もある
いずれにしろ現時点のそのコードだけを考えるならお好きなように
396:>>380
23/04/05 00:34:18.58 .net
>>395
確かに以下のような場合にはEvent.targetを使う必要があるし、「意図をコードに残す」にとても合点がいきました。
<button data-x="1">btn1</button>
<button data-x="2">btn2</button>
const btns = document.querySelectorAll('button');
for (const b of btns) {
b.addEventListener('click', e => console.log(e.target.dataset.x));
}
397:389
23/04/05 10:13:44.20 .net
>>389
に書いた
複数のコントローラーに、イベント登録する場合、
外側・親に、イベントを付けて、親側で子のイベントをキャッチする
398:Name_Not_Found
23/04/05 11:14:44.19 .net
このjQuery信者は文脈や論点ってものを全く理解しないのな
jQueryでは～jQueryなら～ってただただ念仏を唱えて布教に励む様子がまさに信者
399:Name_Not_Found
23/04/05 13:56:33.20 .net
Slickで出来てSwiperでできないようなアニメーション処理って何かある？
400:Name_Not_Found
23/04/06 13:40:22.56 .net
Mathjaxって配列環境でcolspan, rowspanって使えないのか？
\multicolumnというべきか
401:Name_Not_Found
23/04/13 11:04:39.61 08KgWRFK.net
JavaScript でローカルファイルを読み書きするにはどうすればいいでしょうか？
fetchという関数が使えるかと思ったんですが、blocked by CORS policy というエラーになってしまいます。
402:Name_Not_Found
23/04/13 14:00:39.10 .net
CORS(Cross-Origin Resource Sharing)制限は、
ローカルPC 上に、何かのサーバーを立てて、そこから配信すれば良い
VSCode の拡張機能、open in browser では、
file:/// から始まるローカルファイル・アクセスだから、CORS制限あり
file:///C:/Users/Owner/Documents/test.htm
一方、Live Server では、サーバーを立てているから、CORSにならない
URLﾘﾝｸ(127.0.0.1:5500)
同様に、コマンドプロンプト・PowerShell から、
1-liner で、Ruby で作られた遅いウェブサーバー、WEBrick を起動すると、
ruby -run -e httpd . -p 8080
これも、サーバー経由だから、CORSにならない
URLﾘﾝｸ(localhost:8080)
403:Jun
23/04/26 01:05:22.69 2ly3VJ6h.net BE:846651633-2BP(0)
sssp://img.5ch.net/ico/nida.gif
JavaScriptで電卓を作るよ。
404:Name_Not_Found
23/04/27 09:25:37.76 .net
ChatGPTを使って
405:Jun
23/04/27 23:52:36.98 qkYl27sL.net BE:846651633-2BP(0)
sssp://img.5ch.net/ico/nida.gif
JavaScript + HTML + CSS で電卓やホームページを作るのが今の目標です。
406:Name_Not_Found
23/05/09 15:14:09.97 .net
マイナーな質問
XyJaxで、一括して文字色を変える方法教えてくれ
\color{red}を使っても、その箇所だけしか変更できない。
\xymatrix環境内全部の文字色を変えたい
407:Name_Not_Found
23/05/10 19:05:11.90 .net
>>406自己解決
408:Name_Not_Found
23/06/16 12:40:56.37 .net
こんにちは。
誰か教えてください。
<style>
.def { color: red;}
</style>
<div>
<p class="abc">aaa</p>
</div>
<div>
<p class="abc">bbb</p>
</div>
<script>
dif = document.querySelectorAll('.abc');
dif.forEach(element => document.querySelector("div").classList.add("def"));
</script>
このようなコードですが、実行すると1つめのaaaを囲ってるdivにしかclassが追加されません。
条件にあるすべてのdivに追加するにはどうすればいいのでしょうか？
409:Name_Not_Found
23/06/16 14:16:25.94 .net
>>408
document.querySelectorAll('.abc').forEach(element => element.closest("div").classList.add('def'));
410:Name_Not_Found
23/06/16 14:24:00.49 .net
>>409
レスありがとうございます。
closestなんてものがあるのですね。知りませんでした。
おかげで思うように行きました。
ありがとうございます。
411:Name_Not_Found
23/06/16 16:50:32.34 .net
>>408
これでもいけると思う
document.querySelectorAll('div:has(> .abc)').forEach(x=>x.classList.add('def'));
412:Name_Not_Found
23/06/16 16:57:38.56 .net
これでもいいのかな？間になにか挟まってたらダメだけど
('div >:is(.abc)')
413:Name_Not_Found
23/06/16 17:02:39.12 .net
>>411,412
こちらもありがとうございます。
大変助かります。
414:Name_Not_Found
23/07/14 05:34:41.98 zlYPgrgm.net
URLﾘﾝｸ(jsfiddle.net)
こんな表示状態で、textarea に入力して改行していき、表示可能行数を超えると、スクロール状態になります。
入力された行数に応じて textarea が縦に伸びて、textareaのコンテナにあたる li もそれに応じて縦に伸びるようにするにはどうすればいいのでしょうか？
415:Name_Not_Found
23/07/14 17:33:09.83 .net
自前でやろうとせずにライブラリ探してきたら？
416:Name_Not_Found
23/07/14 17:53:03.06 .net
textarea 高さ 自動
でググるとそれっぽいのあったよ
417:Name_Not_Found
23/07/17 03:34:14.72 .net
SELECTタグで、人物を選択出来るようにしたいのですが、SELECTが非展開の時はIDだけ表示して、
展開した時だけ、IDと人物名が表示されるようにする方法を教えてください。
人物配列
↓
var array =
[
{
"id": 1,
"name": "人物1"
},
{
"id": 2,
"name": "人物2"
}
]
こんな表示にしたいです。
↓
URLﾘﾝｸ(i.imgur.com)
418:Name_Not_Found
23/07/17 08:04:52.05 .net
展開したときにどこにID表示されてるの？
419:Name_Not_Found
23/07/17 12:41:46.99 .net
>>417
一応確認するが、非展開時に数字にする意図は何？
フォーム送信時に数字を送信したいだけなら、尊信値(value属性値)と表示する選択肢(子要素の文字列)を分けて書くだけで良いのだが
420:Name_Not_Found
23/07/19 04:29:50.61 .net
URLﾘﾝｸ(getbootstrap.jp)
Bootstrap 5 のDropdowns のページの一番最後に、
ドロップダウンイベントについて書いてある
show.bs.dropdown/shown.bs.dropdown
このイベント発生時に、表示テキストを入れ替えれば？
421:Name_Not_Found
23/07/25 00:23:24.85 .net
(-。-)y-゜゜゜
422:Name_Not_Found
23/11/20 22:52:12.45 .net
何をしていいか分からないな…
423:Name_Not_Found
23/12/12 22:36:34.47 .net
変数名はキャメルケース(getNameなど)がよく使われるようですが、
スネークケース(get_nameなど)はやはり使わない方がいいですか？
424:Name_Not_Found
24/02/28 02:36:50.61 pCYviIFS.net
URLﾘﾝｸ(liveweave.com)
JavaScriptでスプリッターを作っているのですが、左右を分割するスプリッターをマウスで動かしても、マウスの位置とずれてしまいます。
どのように修正すればいいのでしょうか。
425:Name_Not_Found
24/03/28 04:02:18.18 .net
>>423
良いか悪いかはさておき
考え方としては
そのコードを、どのくらいの範囲で共有するのか
ってのを基準に考えたらいいと思う
自分だけなら好きにすればいいし
身内だけなら話して決めればいいし
広範囲なら世間一般の流れに合わせるべき
みたいな
426:Name_Not_Found
24/03/28 04:07:49.72 .net
>>417
すんごい前だけど
似たようなことを頑張ったことある
でもやっぱり
select要素が開いているかどうかを判定出来ないので
原理的に出来なくて
select要素のように振る舞うものを
手作りするのが早かったです
427:Name_Not_Found
24/04/08 00:13:34.85 .net
今動作しているのがサーバ上（https//:～）なのかローカル（file:///C:～）なのか区別する必要性が出てきました。
locationで取得する以外にいい方法ありますか？
区別さえ確実にできれば得られる値は（true/falseなど）なんでもいいです。
428:Name_Not_Found
24/04/08 12:44:09.64 .net
>>427
window.location.protocolを見れば良いんじゃないかな
httpかhttpsなら、みたいな
429:Name_Not_Found
24/04/18 13:55:10.68 NjgPbiyX.net
var people = [{
"id" : "ID1", "name" : "人物1", "room" : "1"
}{
"id" : "ID2", "name" : "人物2", "room" : "2"
}]
var select_tag = document.getELementById("my_select");
for ( var i = 0; i < people.length; i++ ) {
var option = document.createElement("option");
option.value = people[i].id;
option.innerText = people[i].name;
my_select.append(option);
}
こういう感じの select を設置して、option が選択された時に、選択された人物の room を取得するにはどうすればよいのでしょうか？
430:Name_Not_Found
24/04/18 17:45:29.04 .net
>>429
select_tag.selectedIndexに
今選ばれてるoptionが何番目かが入ってるから
select_tagのchangeイベントにフックして
その数字を拾って、people[数字].idを参照したらいいよ
431:Name_Not_Found
24/04/18 17:53:34.56 .net
ごめん間違えた
people[数字].roomだった
すまんこ
432:Name_Not_Found
24/04/19 02:15:05.41 .net
>>431
出来ました！ありがとうございます！
select_tag.addEventListener("change", (e) =>{
let i = select_tag.selectedIndex;
alert(people[i].room);
});
433:Name_Not_Found
24/05/07 02:22:40.33 YeUeQCju.net
calleeという古語を使っていたが
怒られた
434:Name_Not_Found
24/05/07 06:21:21.73 .net
>>433
arguments.calleeは無名関数式で使う人が多かった印象
URLﾘﾝｸ(developer.mozilla.org)
名前付き関数式に変えれば解決する課題だと思う
435:Name_Not_Found
24/05/09 18:11:07.56 .net
今のJavascriptファイルの管理って、どれがスタンダードになっていますか？
webpackはだいぶ古いんですよね？
436:Name_Not_Found
24/05/09 20:40:41.69 .net
>>435
そもそもwebpackは管理するものではないのだが…
バンドルツールのシェアのことなら
webpackがまだまだ支配的だと思う
viteとturbopackが頑張り始めたところだけど
この辺はJSだけの話ではなくなるので
なんとも言い難い感じ
437:Name_Not_Found
24/05/09 20:42:16.82 .net
パッケージの管理のことなら
npm一択な気がする
ツール自体はyarnとかpnpmとか色々あるけど
438:Name_Not_Found
24/05/10 01:03:55.90 .net
Ruby on Rails では、npm は遅いから、yarn を使う
Rails 7 からは脱webpack で、
Import Maps で、CDN から直接インポートする
HTTP/2 が普及して、バンドル・Node.js が不要になった。
バンドル不要のTailwind を使う
バンドルするなら、esbuild, rollup, webpack を使う。
esbuildならCSS プロセッサとして、Bootstrap を使う
439:435
24/05/10 08:14:30.07 .net
>>436-438
バンドルツールのことです。
webpack→viteと学んでいるのですが、
正直複雑すぎてついていけてません・・・
特にviteでバンドルして生成されるファイル構成に
どうしても違和感があって、勉強を中断しています。
ChatGPTに聞くとviteのようにハッシュ値で変換した
ファイル名にすることでセキュリティが高まるそうですが、
元のファイル名から変わるのに違和感を覚えます
440:438
24/05/11 08:51:08.46 .net
Vite は、Vue.js の作者だったか？
Vueも、Vue 3 で人気が無くなって、React 一色になった
2, 3年前は、Vueが転職で有利だったのに、
今は、React, TypeScript
ブラウザのキャッシュ対策として、
ファイル名はハッシュ値の方が良い
ファイルを更新するとハッシュ値も変わるから、
古いファイルがキャッシュされない
どうせ配布用のファイル名だから、開発用には関係ない
441:Name_Not_Found
24/05/11 17:41:41.54 .net
Viteの書き出すファイル名はconfigで変更できたような
442:Name_Not_Found
24/05/12 01:16:53.68 .net
>>439
元のファイル名がわかることに
どこまで意味があるのか？って話じゃね？
たとえばbabel+webpackだって
トランスパイル、パッキング後は
部分的にバイナリになったりするわけで
要するに人間の読めるものではなくなる
つまり、ファイル名がハッシュ化されなくても
人間が得られるものはせいぜい
そのファイルがなんなのかの想像がつきやすい
程度のこと
ファイル名が中身と全く関係ない
なんてこともよくあるとは言わんまでも
一定数わけで、となるとデプロイされるファイル名には
それほど大きな意味がない
ってことが多いのではないかな
443:438
24/05/12 01:18:55.04 .net
Vite は、Ruby on Rails をコピーしたのかな？
foreman, webpack-dev-server で、hot reload するみたいな？
ファイルを修正したら、即ブラウザに反映されるとか
開発時には、CSS をコンパイルせず、
動的にスタイルを当てているだけとか
444:435
24/05/13 12:34:09.69 .net
Viteの使い方がやっとわかりました！
ファイル名が変わるのは許容します
これから少しずつ学んでいきます
みなさんアドバイスありがとうございました
445:Name_Not_Found
24/05/19 12:06:09.78 .net
実際にサイトをサーバーに公開することになったらファイル名のうしろにつくハッシュ値の恩恵がわかると思うよ
キャッシュのこと気にしなくていいからね
446:Name_Not_Found
24/05/19 17:31:28.31 t4Sl9HBx.net
アプリで登録されたユーザー情報をWEBアプリで管理するということで
制作会社から管理画面のラフが送られてきたのですが、
ある箇所で、アプリで登録したユーザーのメアドをプルダウンで選択するんだそうです。
447:Name_Not_Found
24/05/19 17:31:42.46 t4Sl9HBx.net
続き
「今はテストなので登録数は20-30件ですが、仮に50,000人とかになったら？」
と尋ねたら「プルダウンされた50,000行の中から目視で探す」んだそうで
それが正しいやり方だと言い張って平行線です。
どう論破したら良いでしょう？
448:Name_Not_Found
24/05/19 17:31:54.90 t4Sl9HBx.net
URLﾘﾝｸ(imgur.com)
449:Name_Not_Found
24/05/19 17:32:34.27 t4Sl9HBx.net
長文の投稿ができなかったので分割にて投稿させていただきました。
何卒よろしくお願いいたします。
450:Name_Not_Found
24/05/19 21:33:26.78 .net
論破もくそもねーわ
変更したいなら変更すればいいじゃん
これ100％発注側の問題だからな
451:Name_Not_Found
24/05/19 21:37:15.08 .net
まあそうだわな
客あるあるだけど
欲しいもの、必要なものをちゃんと説明できないのは
本当によくあることで
だいたいの不幸や不具合はそこが起点になるんだ
作る側もそれはわかってるから
出来るだけ真意を聞き出そうとはするんだけど
で、平行線になってるってことは
説明不足のまま、もう作っちゃったからでしょ
ちゃんと追加料金払って変更してもらいなさいな
452:Name_Not_Found
24/05/19 23:34:29.79 t4Sl9HBx.net
今後のために教えてください。
「アプリで登録されたユーザー情報」を「WEBアプリで管理したい」
という話し合いはしていましたがプルダウンにする/しないという
話し合いは確かにしていませんでした。
また自分は普段別の領域で制作業務を行なっており
アプリに関して無知ですが制作系はそこそこのクライアントをこなしています。
アプリの業界では特に話し合いを詰めないと
この様な非常識な仕様がポンと出てくるものなのでしょうか？
自分がいる業界ならば二度と仕事は振られないと思います。
（考えれば使いづらいのは話し合うまでもなくわかるでしょう、それがわからないのなら次はない、という感じ）
453:Name_Not_Found
24/05/20 04:30:40.53 .net
>>452
>「アプリで登録されたユーザー情報」を「WEBアプリで管理したい」という話し合い
いやいやざっくりすぎやろｗ
項目すら詰めてないとか非常識にもほどがあるんだけど
454:Name_Not_Found
24/05/20 04:41:36.75 .net
>この様な非常識な仕様がポンと出てくるものなのでしょうか？
どういう会社にどういう条件でいくら支払うか次第
海外とかにユルユルな発注を低予算でやるとそれなりによくあること
さすがに5万件になったら使いづらいというのは受注側も百も承知
それが理解できないような人間には出会ったことがない
お金の問題かスケジュールの問題か人不足か
いずれにしろ仕様変更の影響度が大きすぎるから今の条件では対応できないということ
ぶっちゃけ言えば君から二度と仕事を振られなくても別に困らないということでもある
455:Name_Not_Found
24/05/20 05:52:45.85 .net
非常識な業者は多い。
だから優秀な社員、又はアドバイザーみたいな第三者を雇う。
例えば家の売買なら、直接売買せずに宅建業者を通すのと同じ
後はキャンセルして、裁判して金を取り返す。
そんな業者と付き合っても損するだけ
詐欺みたいなもの
456:Name_Not_Found
24/05/20 10:57:02.57 .net
>>452
>アプリに関して無知ですが
無知な人が関わっちゃったのが
問題の根っこなのはさて置き
データ件数とかは設計時に検討した？のかな？
自分も死ぬほど経験しているけど
ウェブ制作会社のディレクターって
ウェブのこと全然知らないじゃん？
あんまり関わらない方がいいよ
自分でも作れるけどやらないだけ、くらいになるまでは
457:Name_Not_Found
24/05/20 12:27:55.29 .net
NGワードに引っかかって書けない
458:Name_Not_Found
24/05/20 12:29:03.18 .net
登録済みユーザーを一覧できる画面とか存在しないのかな？
負荷を無視して単に使い勝手を改善したいならデータリストに変更すれば解決
459:Name_Not_Found
24/05/20 13:50:28.68 .net
独自のプルダウンを開発すれば5万件いける
無限スクロールすればいい
460:Name_Not_Found
24/05/21 00:30:12.39 rWUCBStb.net
質問者です。
知り合いのエンジニアさんが助けてくれて
解決できる機能のソースコードは持っていて、
自由に使って良いですよ、と言われているのですが
提案したらクオリティの担保ができないから断られました。
まあわかるんですが、クオリティが低いから問題になっているのですが、、という感じです。
461:Name_Not_Found
24/05/21 02:01:35.96 .net
その開発会社思ったよりはまともそうでよかったじゃんｗ
462:Name_Not_Found
24/05/21 02:09:32.00 .net
キチガイクライアント掴んでしまったか
463:Name_Not_Found
24/05/21 10:08:23.66 .net
書けば書くほど墓穴を掘っていくな
君が第一にやるべきはソースコードを渡すことじゃなくて
どう修正して欲しいかを含めて整合性のある要求仕様としてまとめて提示することだぞ
単純なCRUDアプリなんだから要求仕様さえきちんとまとまっていればこんな問題は起きない
464:Name_Not_Found
24/05/21 10:26:57.06 .net
モバイルアプリで登録済みのユーザー情報を管理するためのWebアプリなら
普通は検索画面、一覧画面、ユーザー単位の詳細画面があって
一覧画面や詳細画面からユーザー単位の編集画面へリンクされるので
編集画面でそのユーザーのメールアドレスをドロップダウンから選ぶ必要はない
あるユーザーと別のユーザーを手作業で紐づける機能が必要ということであれば
ユーザー単位の編集画面から紐づける機能を起動して検索画面 -> 一覧画面 -> 詳細画面と辿る
この場合は紐づけ処理中かどうかで一覧画面や詳細画面の内容を変える必要があるから画面数の扱いとしては別画面
465:Name_Not_Found
24/05/21 10:59:06.94 .net
このくらい小規模な開発だと
要件定義含めて客とのやり取りと
客に説明するためのドキュメント作りがコストの大半だからな
それを理解しない客は避けるに越したことがない
466:Name_Not_Found
24/05/21 18:20:05.59 rWUCBStb.net
>>463
単純なCRUDアプリであれば、
整合性のある要求仕様を提出しなくても
ある程度のクオリティが上がってくるものだとおもっていました。
こちらは私の完全な落ち度ですね。
ただ、この場合制作会社が
「仕様書がなかったから、或いは具体的な指示がなかったから50,000行を一気に表示しても良いと思った」
として50,000行を一気に表示するようなものを作った、みたいなことはよくあることなのでしょうか？
自分の業界であれば素人のクライアントには合理的な解決法をアドバイスするかなと思います。後で自分が地雷撤去で困ることもあるし、次の仕事がほしいので。
467:Name_Not_Found
24/05/21 21:26:12.02 .net
>>466
>単純なCRUDアプリであれば、
>整合性のある要求仕様を提出しなくても
>ある程度のクオリティが上がってくるものだとおもっていました。
アホすぎるｗｗ
468:Name_Not_Found
24/05/21 21:40:15.32 .net
提案内容が気に入らないなら望ましいと思う内容に変更してもらえばいいだけなのになぜそれができないんだろう？
そこに問題の本質がありそう
469:Name_Not_Found
24/05/21 21:41:14.86 rWUCBStb.net
>>468
日本語の堪能なアメリカ人なんですけど
正しいから直す必要がないの一点張りなんですよね。
470:Name_Not_Found
24/05/21 22:38:06.75 .net
>>469
下らない嘘までついて隠さなきゃいけない裏事情があることだけはよく分かった
471:Name_Not_Found
24/05/21 22:41:00.51 .net
>>462
マジでコレっぽいな
472:Name_Not_Found
24/05/21 22:46:59.30 .net
金を出し渋り過ぎたんじゃね？
473:Name_Not_Found
24/05/21 23:05:12.35 .net
金もそうだろうけど
どう変更したいかを一切書かないあたりもかなり怪しいわな
474:Name_Not_Found
24/05/22 00:28:14.60 +dtlvEAW.net
>>470
詳細は言えないですがマジです。
475:Name_Not_Found
24/05/22 00:59:17.68 .net
契約解除するのがいい
そもそもできない奴に仕事振ってるほうがおかしい
476:Name_Not_Found
24/05/22 01:04:21.32 +dtlvEAW.net
納品まで大詰めで、並行して別の会社を探しており移行に入ります。
ただしミスや納品の遅れを指摘すると、仕事自体を降りるだの、ストアに上がっているガワだけできているバージョンを下すだのと、すぐに感情的になってしまうので対応に苦慮しております。大分気を遣ってるんですけどね。
477:Name_Not_Found
24/05/22 01:42:14.14 .net
>>476
2行目から何を言ってるのかわからん
主語は誰だよ
478:Name_Not_Found
24/05/22 02:54:11.52 .net
納品まで大詰めでUIのラフを初めてレビューする・・・ガチキチクライアントw
479:Name_Not_Found
24/05/22 03:09:51.43 .net
言い訳が幼稚過ぎて笑う
全部自分の能力不足が原因なのにそれに気がついてないのか
それとも気がついていて他人に責任を擦り付けようとしてるのか
480:Name_Not_Found
24/05/22 05:14:38.15 .net
>>460
>他者のコードを使うと、クオリティの担保ができない
コードを少し見て、自分で似たようなものを作れるはず
>>466
>指示がないから、5万行を一気に表示しても良い
こんな言い訳は詐欺だろ
やらない言い訳ばかりする香具師は、時間の無駄。
結論は出来ないに決まっているから
単なる詐欺。素人をだますのはよくある。
作り逃げも多い。動かなくなっても逃げてしまう
だから、コンサルタントみたいな判定する人が重要。
知り合いから評判を聞くとか、良い人を推薦してもらうとか
それと名前欄に、最初の投稿時の番号をいれて下さい！
どの書き込みが質問者か分からないので
481:Name_Not_Found
24/05/22 10:58:11.05 .net
>>476
ストアに上がっているガワだけできているバージョンを下ろされると困るとか
成果物の管理方法が杜撰すぎてしゃれにならんな
杜撰な管理方法でも事前に書面による了承を取っていればセーフかもしれんが
取ってないならクライアントから訴えられたら確実に負ける
482:446
24/05/22 11:17:37.58 +dtlvEAW.net
>>480
ご指摘ありがとうございます！
これから名前欄を446で進めさせていただきます。
483:Name_Not_Found
24/05/22 11:55:33.67 .net
selectに入るものが何万件にもなるって
伝えていたのか否か、だけじゃろ？
伝えていたなら、そのまま
伝えていなかったら、謝って金払って
作り直して貰えばいいだけじゃん？
みんなそんなに罵倒したりなんだりしなくても…
484:Name_Not_Found
24/05/22 12:25:20.81 .net
共感してくれるのはルビキチ君だけというｗｗｗ
485:446
24/05/22 12:50:27.44 +dtlvEAW.net
>>483
伝えていました。
486:Name_Not_Found
24/05/22 13:35:58.23 .net
文句言ってる間にも全件対応すればいいじゃん
なんでやらないの？
487:446
24/05/22 14:03:51.39 +dtlvEAW.net
>>486
私が対応しろということでしょうか？
私的には知り合いのエンジニアに頼んで
TamperMonkeyでウェブを書き換えて最低限の修正をしました。
488:Name_Not_Found
24/05/22 14:25:35.97 .net
>>487
お前の立ち位置がわからんし主語がないから登場人物が誰で誰について言ってるのかもわかんねえんだわ
まあそんなんだからコミュ力ないお前の責任なんだろうが
489:Name_Not_Found
24/05/22 14:29:06.81 .net
>>483
伝えていたか否かが問題じゃないんだよね
伝えてたとしてもUIが自分の欲しいものになってるかどうかはわからないわけで
欲しいものじゃなければ変更してもらえばいいだけなのに
なぜかそれが出来ないというところが問題
普通の契約をしてれば変更してもらえないなんてことはあり得ないでしょ？
叩かれてるのは加害者が都合の悪い情報を隠して被害者かのように振る舞ってるから
490:446
24/05/22 14:42:24.09 +dtlvEAW.net
>>488
>>486の主語は誰になりますか？
491:446
24/05/22 14:49:48.48 +dtlvEAW.net
>>489
会社自体は日本人の社長の会社ですが
担当がアメリカ人なのです。
言語の壁はないということで概ねペラペラなのですが
すぐに感情的になります。
繰り返しですが、そのアメリカ人がこの程度の変更要求をしても
「問題ない」の一点張りで更に食い下がると「プロジェクトを降りる」「アプリをストアから下げる」と度々発言しており、仮に彼が実行したら裁判でしょうが
アプリを完成させるために反論をせずになるべく平穏に収めようとしています。
都合の悪い情報を隠したりはしていませんが
具体的な内容の全てを話せないのは確かにあります。
なお本業でもディレクターなので揉めそうな事件が起きたとしても
度々火消しをして収めていますが、こんな簡単なことで突っかかられたことがないので
ここで質問をしています。
492:Name_Not_Found
24/05/22 14:51:17.42 .net
経験がある人は最初の投稿だけでどっちに非があるのかすぐ分かる
技術的な問題じゃないから経験がないとすぐには分からない
493:Name_Not_Found
24/05/22 15:01:32.72 .net
>>491
一担当者の問題ならその会社に対処してもらえばいいだけじゃん
彼がプロジェクトを降りるかどうかは相手の会社内部の問題
請負契約なら誰が担当しようが途中で交代しようが
契約で求めた成果物を出しさえすれば何の問題もないよ
アプリをストアから下げることの何が問題なのかわからない
ストア管理を含めて契約をしてるなら契約不履行
誰か書いてたけどそれで納品ができなくなるようなら
それは君の会社の落ち度
494:Name_Not_Found
24/05/22 15:13:40.16 .net
>>490
お前しかいねえだろ
javascriptスレにプログラマー以外が来るのか？
お前が実装できないとかほざいてるんだろが
495:Name_Not_Found
24/05/22 15:14:47.18 .net
クライアント（日本人社長とアメリカ人担当者）
446が素人プログラマー
496:Name_Not_Found
24/05/22 15:17:32.51 .net
アプリ開発のクライアント → 日本人社長とアメリカ人担当者）
446 →上のクライアントから受注してアプリを開発してるプログラマー
外野 → 知り合いのエンジニア
497:Name_Not_Found
24/05/22 15:20:56.00 .net
>>491
もうちょっと論理的に事実と主観を分けて書こうね
相手の人格否定で自分を正当化しようとしてもいろいろ透けて見えてるから誰も好意的に見てくれないよ
普段からそんな感じだとしたら相手のアメリカ人も相当鬱憤が溜まってたんじゃないだろうか
498:Name_Not_Found
24/05/22 15:24:55.56 .net
>>495,496
[商流]
顧客企業 → 446の会社 → モバイルとWebのアプリ開発会社
でしょ？
499:446
24/05/22 15:27:03.81 +dtlvEAW.net
>>493
仰る通り、究極的には契約書上は制作会社側の契約不履行になります。
問題の箇所だけにフォーカスを当てると、
「Aで定義したデータをBに紐づける」「Aの数は万人を超える」事は要件定義しておりますが、
「（Aの数は万人を超えるので探しやすい様に）検索機能をつけて紐づける様にして欲しい」と話していませんでしたのでその点は落ち度なのだと思います。
しかし、その指定を怠ると
「Aの数は万人を超える」のを理解しておきながらプルダウンで目視して「Aで定義したデータをBに紐づける」という結果になってしまうのが理解できないのです。
プルダウン機能は当然こちらは要求していません。
ですので、「この仕様で万件の中から1件を目視で探すのは無茶ですよね」と指摘されたら「確かにそうですね、作り直します」で終わる話なのではないかと思います。
この様なことがアプリ本体でも多々あり、その度に担当さんが感情的になってしまうので困ってしまい質問をしています。
500:446
24/05/22 15:30:49.27 +dtlvEAW.net
>>497
あなたと対立したいわけでないので
もう少し教えていただけますか？
アメリカ人の人格を否定したのではなく
「ただアメリカ人に直してくれ言えばいいじゃん、他に言えない理由があるんだろ」と言われたので「理由は彼がすぐカッとなるから」が答えで、それを正直に答えたまでです。
これは悪かったでしょうか？
501:Name_Not_Found
24/05/22 15:31:23.96 .net
>>498
違う
アメリカ人基地クライアント → 446ディレクター → エンジニアと知り合いのエンジニア
502:446
24/05/22 15:32:47.57 +dtlvEAW.net
なお私は
>>452
で書いている通り、別業界におりプログラマーではありません。
503:Name_Not_Found
24/05/22 15:37:44.79 .net
ここはjavascriptのスレッド
javascriptの質問をどうぞ
504:446
24/05/22 17:02:36.51 +dtlvEAW.net
>>494
私はプログラマーではないし、
あなたの文章にも主語がないですよね
対立はしたくないですが、これは事実なので申し訳ないです。
505:Name_Not_Found
24/05/22 17:28:34.32 .net
ただの愚痴レスか
506:Name_Not_Found
24/05/22 17:31:02.57 .net
JS全く関係なくて驚いた
507:Name_Not_Found
24/05/22 17:49:27.63 .net
>>499
まーた都合のいいところだけ答えようとするよなぁ
>>493が書いてる通り1担当者が指示を効かないという問題なら
相手の会社の責任者に言って対応してもらえばいいじゃない？
なんでそれをしないの？
508:Name_Not_Found
24/05/22 17:59:54.56 .net
マジでこいつ救いようがないな
担当者がアメリカ人だとかすぐ感情的になる(と君が感じてる)だとか全く関係ないじゃん
自分のマネジメント能力の欠如が一番の問題なのにそれを自覚してるようにすら見えない
自分の責任は放棄しておいて開発会社の担当者に責任転嫁して自己正当化しようとしてる
挙句の果てに俺はWeb制作ならマネジメント経験あるんだぜみたいなどうしようもないアピールまでしちゃう
はぁ～
509:446
24/05/22 18:07:34.24 +dtlvEAW.net
>>507
最終的にはしますよ。
その前段階の話をしています。
510:446
24/05/22 18:08:28.89 +dtlvEAW.net
>>508
何度も言いますが自分の落ち度は認めています。
またアピールをしたつもりはありません。
511:446
24/05/22 18:10:03.97 +dtlvEAW.net
>>508
「俺はWeb制作ならマネジメント経験あるんだぜ」
どこで言ってます？
512:446
24/05/22 18:16:39.25 +dtlvEAW.net
>>508
あなたには全く関係ない様に見えても私には大いにありますね。
ただし、そういう事情は質問の内容とは関係ないので最初は話していません。
「なぜ制作会社に『直してくれ』が言えないのか？」という内容の質問に理由を答えたまでです。
513:Name_Not_Found
24/05/22 18:20:13.30 .net
>>499
>「Aで定義したデータをBに紐づける」「Aの数は万人を超える」事は要件定義しておりますが
こういうのは要望の羅列であって要件定義したとは言わないんだが
それはいいとしてAで定義したデータをBに紐づけるのならブルダウン以前に
Bの新規登録画面でAを選択させるというのは依存関係的に間違い
>「この仕様で万件の中から1件を目視で探すのは無茶ですよね」
数文字タイプすればいいだけだから無茶ではない
それを許容できるかどうかは非機能要件次第
定義してないなら愚痴以上の何ものでもない
>「確かにそうですね、作り直します」で終わる話なのではないかと思います。
どう作り直して欲しいのか具体的な指示なしにそうはならない
具体的な修正指示は出した？
指示に従わないならこんなところで愚痴らず会社対会社で対応するだけだと思う
514:Name_Not_Found
24/05/22 18:21:46.91 .net
>>512
え？「直してくれ」と言ってないの？
515:446
24/05/22 18:25:14.74 +dtlvEAW.net
>>507
あなたが思う、私が答えていない都合の悪いところはどこですか？
508さんも私が「自己を正当化」していると指摘していますが、
匿名の掲示板で不特定多数に「私は間違っていない」と主張したところで
何も解決しないですし、何なら自分の立場を良く見える様に作り変えることだってできると思いますがそれをしたところで何の意味もありません。
あなたに自分の主張を通したいと思っていません。
またそのために不都合な部分を隠す、捏造するようなことはしていません。
質問をしているだけです。
516:Name_Not_Found
24/05/22 18:33:20.93 .net
>>509
なんで「最終的には」なんだよ すぐやれよｗ
マネジメント能力が欠如してるのはそういうところだぞ
その前段階の話て「担当者が言うこと聞いてくれないんです～どうしたら言うこと聞いてくれますかね～～」とか5chでウダウダやってるだけだろ
しかもJavaScriptスレで
517:446
24/05/22 18:38:07.59 +dtlvEAW.net
>>513
ご指摘ありがとうございます！
＞Bの新規登録画面でAを選択させるというのは依存関係的に間違い
どうするのが正しいでしょうか？
もしよろしければ今後のためにご教授願いたいです。
＞数文字タイプすればいいだけだから無茶ではない
制作会社ではAの項目に入力されたデータ（ユーザーのメアドになります。）
をBでプルダウンで表示し、そこから目視で選択せねばならない仕様でした。
それが非合理ではないかという私の指摘に対し制作会社が「そうは思わない」と
主張し平行線になっています。
そこで知り合いのエンジニアに頼んで、TamperMonkeyを入れてスクリプトを入れてBのプルダウン機能を外し、文字入力に切り替えオートコンプリートにして
数文字タイプすればいいようにしました。
＞具体的な修正指示は出した？
知り合いのエンジニアがささっと作ってくれたプロトタイプの動画切り出しを送り、
「今はサンプルで登録されている20-30人のメアドで見ているのでプルダウン形式で良さそうだが、実際には前から話している様に万人規模の管理になるのでプルダウンで目視で探すよりも、このサンプル動画のようなオートコンプリート機能、または検索機能が良いのではないか？」と提案しました。
そうしたところ、「他人のスクリプトを入れるのはクオリティの担保ができないし危険」との事です。
別にそのものを使えとは言っていないのですが「提案を取り入れる」というよりも「今のままでいいので拒絶する」というスタンスになってしまっています。
518:446
24/05/22 18:45:32.51 +dtlvEAW.net
>>516
あなたのマネジメント論ではそうかもしれませんが、
数社が参加しているプロジェクトなので穏便に済ます必要があり
私は「トップに話して即解決する」という選択肢を選んでいません。
ですので出来るだけ波風を立てず、技術的な解決をするためにここで質問を書き込んでいます。
その過程で技術面からは外れた質問を投げかけられたので質問にそのまま答えています。
私は自己の問題解決のために寄せられた質問に対してより正しい回答が返ってくるのであればという思いで答えているだけです。
その点に関して不快に思ったのならば謝りますが何卒ご容赦ください。
519:Name_Not_Found
24/05/22 18:56:13.56 .net
結局どうしたいんだ？
そのアメリカ人を我々が説得すればいいのか？
520:446
24/05/22 19:23:33.00 +dtlvEAW.net
>>519
・アメリカ人が主張する「数万件をプルダウンで目視するという機能が一般的である」ということが客観的にみて正しいと言えるのかというご判断がいただきたいです。
・私は非合理であるという立場ですが、もし皆様の中に「非合理である」という判断をしてくださった場合、現状が非合理であるとする客観的な証明をご教授いただきたいです。
・また代替案のスクリプト処理の方法のアドバイスを伺いたいです。
前述の通り、ここでの質問と並行で進めてくれていた知り合いのエンジニアによって当座は問題は解決しましたが管理画面そのものは私の私感では「良くない」ものであるという判断です。
アメリカ人は直す必要がないし直すなら追加予算をくれと言っております。
お金が無い訳ではないですが、知り合いのエンジニアの方が明らかに合理的な解決をしてくれたので、追加予算を支払ったところで劇的に改善は見込めないので揉めずにお仕事をしていただいた分のフィーを支払い、次期に向け別の会社を探そうと思います。その際にどの様にすると良いのかアドバイスをいただきたいのです。
521:Name_Not_Found
24/05/22 23:46:12.55 .net
素のhtmlのselectの子要素のoptionを数百以上も表示するのは一般的ではない
なぜなら
・画面操作が重くなる
・スマホを使う場合、iPhoneとAndroidではそれぞれ独自のコンボボックスUIになる
・データベースへ無制限selectはアンチパターン
・データベースでメモリリークを起こす可能性がある
・ネットワークの転送効率が悪くなる
522:Name_Not_Found
24/05/22 23:49:40.43 .net
データベースに大量の行となるselectはアプリ側で必ずページネーション処理を行うことが一般的
・ページネーションとは、1回のクエリを1000件ずつのように小分けにしてデータを取得すること
・データベースの効率化とメモリとネットワークの転送効率のため
・UIは2パターン
1. 検索ウインドウとデータテーブル
2. 仮想スクロールによる独自コンボボックス
523:Name_Not_Found
24/05/23 00:06:05.66 .net
>>448
モザイク処理をしているけど、おそらくこれは「メールアドレスと名前」のプルダウンになっているのだと思うが、これを「参照」または「リファレンス」というデータベースで関連づけをするためのプルダウンなのだろう
そうすると余計に検索ウインドウを使うのが一般的な設計になる
メールアドレスまたは名前でlike検索をすると候補が出てくる
そして候補の中から1つ選択する
参照対象を全てプルダウンに表示するなんて、世界中みてもそんなクソ設計はあり得ない
524:Name_Not_Found
24/05/23 04:20:38.02 .net
数万件を表示するなど、あり得ない。
普通は分割するとか、page nation を使う
こういう要望を聞いたら、おかしいと大激論になるはず。
数万件は無理だから、設計のやり直しになる
双方で議論すべき。
議論しなかったら後でもめる
525:Name_Not_Found
24/05/23 04:35:25.95 .net
TamperMonkeyのスクリプト納品したらウケるな
数万件のプルダウンに負けず劣らず非常識
526:Name_Not_Found
24/05/23 04:55:30.13 .net
つまり見解の相違でしょ。
何の仕事でも、こういう事は起こる
例えば演劇で、その演技はおかしいから変更してと言っても、相手が突っぱねる。
普通は従わなければ首で良い。
ところが首にできないというだけの話でしょ
従わない香具師は一杯いる。
だから、こういう香具師に引っ掛からないようにするために、調査費用を掛ける
技術力のない香具師が従うわけない。
できないから無理でしょ
そいつらは技術者じゃない。
技術者なら徹底的に議論して、方法を考えるはず
感性が合わないとか、仕事ができない香具師とは、一緒に仕事なんてできない。
典型的なGoogle が採用しない人。
言い訳ばかりして、何もできない香具師
527:Name_Not_Found
24/05/23 06:22:40.39 .net
ルビキチ君が言うと説得力あるねw
528:Name_Not_Found
24/05/23 07:04:54.63 4jCy9DUk.net
>>520
相手の国籍この話に関係ある？
海外に発注してたりして文化や商習慣や法律の違いが明らかに影響する話ならともかくそうじゃないところでアメリカ人アメリカ人と連呼するのは差別主義的な行為だよ
529:Name_Not_Found
24/05/23 10:20:48.69 .net
>>518
相手の会社のプロジェクト体制は作業担当者の上が会社トップなの？
であれば担当者間で解決できない話はそのトップに通すしかないでしょ
常識的なプロジェクト管理をやっていれば
プロジェクト開始前にプロジェクトの体制図を作って
指揮命令系統や権限や役割分担を明確にして
公式なコミュケーション方法やエスカレーション方法が事前に定義する
UIレビューには誰が参加して誰の承認が必要なのか？
意見が対立したときの最終意思決定者は誰になるのか？
レビュー結果としての正式な修正依頼はどういう方法で行うのか？
↑これらも事前に明確になってる
今回の件で「プルダウンじゃだめだから〇〇に変更してください」という修正依頼を
相手の会社の責任者や自分の上長やその他の関係者にも見える形の
公式なコミュニケーション方法を使って本当に実施したのかな？
それに対して正当な理由なく「今のままでいいので修正は拒絶する」という回答を
同じように公式なコミュニケーション方法を通して得たのかな？
であれば事前に定義されたエスカレーション方法に則って解決を測ればいいだけ
普通のプロジェクトならどっちもメール1通+打ち合わせ1回とかで済む話
530:Name_Not_Found
24/05/23 10:34:21.02 .net
(続き)
正直なところ関係者全員が見てる中で
正当な理由なく「今のままでいいので修正は拒絶する」と回答するとは到底思えないから
それまでの段階でこっちが想定している前提と異なる一般的ではない状況があるのだと推測してる
>>517を読むとしきりに「提案」という言葉を使ってるのが気になる
まるで開発会社のほうに意思決定権があるように聞こえる
もちろん数万件のプルダウンによるUIの使いにくさや性能問題を解決しようとすると
プロジェクトとしてそれよりも優先すべき要件(性能・セキュリティ・品質などの非機能要件や、予算や納期)を満たせなくなるという正当な理由があるなら拒否されるのも道理だけど
その拒否自体が承認するかどうかはお金を出してる顧客側が判断することのはず
開発を受注した相手方の担当者一人と発注側から君一人しか登場人物が出てこないのもおかしいし
UIレビューを納品まで大詰めになった段階で一人でやってるのもおかしいし
実際にWebアプリを使うエンドの顧客がレビューしてる様子がないのもおかしい
数万件のプルダウン以上に不自然なことだらけ
そもそも5chに相談する前に上司には相談した？
したのであれば上司はどう対応しろって言ったの？