http://oshiete1.goo.ne.jp/qa2734284.html
を見たのですが、よく、分かりません。
簡単な電卓を作っていて、
テキストボックス内で、「backspace」ボタンを押すと、
文字が後ろから、一個ずつ、減っていくようにしたい。
javascriptどういう数式を書けば、
文字数を一個減らした文字列を代入できるのか、分かりません。
方法を教えてください。
No.2ベストアンサー
- 回答日時:
こんな感じでどうでしょうか?
// キー入力を掴むイベントハンドラ
document.onkeydown = function () {
// 押されたキーコードが0x08(BackSpace)の時かつ、
// テキストフィールドにフォーカスが当たっていない場合
if (event.keyCode == 0x08 && event.srcElement.type != "text") {
// BackSpaceキーを押された時の処理
pushBackSpase();
// BackSpaceキーの処理(前ページへ遷移)を無効とする
return false;
}
}
function pushBackSpase(){
// 末尾1文字削除して挿入
document.f.into.value=document.f.into.value.substr(0, document.f.into.value.length - 1);
}
この回答への補足
自分の考えていたものよりも、画期的なものでした。
間違えた所に、マウスをあわせて、その一つなら、削除できるのが、
すごかったです。
「Backspace」ボタンを押すと、一番後ろの文字が削除されると、
いうのが、自分の考えだったのですが…
キーボードの「Backspace」キーで
自然な動きが出来るほうが、いいと、思いました。
これ以上の議論は、自分のjavascriptの勉強不足もあるし、
おおやけの議論としては、達したと考えて、解決としたいと思います。
t_wadaさん、他のなやんでくれた方々、ありがとうございます。
No.1
- 回答日時:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …<html xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>サンプル</title>
</head>
<body>
<!-- 赤い部分に入力。テキストボックスからフォーカスが無くなった時一文字減らした文字列を代入するようにした-->
<p><input type="text" onBlur="this.value = this.value.substring(0,this.value.length - 1)" value="" style="background-color:red;" /></p>
</bodpy>
</html>
この回答への補足
<html>
<head>
<title>電卓</title>
<script type="text/javascript">
<!--
function push(alpha){
document.f.into.value=document.f.into.value+alpha;
}
//-->
</script>
<script language="JavaScript">
<!--
function calc() {
f.ans.value = eval(f.into.value);
}
// -->
</script>
</head>
<body>
<form name="f">
計算式:<br>
<input type="text" name="into" size="40" style="font-size:20; text-indent:20;"><br><br>
<input type="button" value=" 1 " style="height:30; width:30; font-size:20;" onClick="push('1')">
<input type="button" value=" 2 " style="height:30; width:30; font-size:20;" onClick="push('2')">
<input type="button" value=" 3 " style="height:30; width:30; font-size:20;" onClick="push('3')">
<input type="button" value=" 4 " style="height:30; width:30; font-size:20;" onClick="push('4')">
<input type="button" value=" 5 " style="height:30; width:30; font-size:20;" onClick="push('5')"><br>
<input type="button" value=" 6 " style="height:30; width:30; font-size:20;" onClick="push('6')">
<input type="button" value=" 7 " style="height:30; width:30; font-size:20;" onClick="push('7')">
<input type="button" value=" 8 " style="height:30; width:30; font-size:20;" onClick="push('8')">
<input type="button" value=" 9 " style="height:30; width:30; font-size:20;" onClick="push('9')">
<input type="button" value=" 0 " style="height:30; width:30; font-size:20;" onClick="push('0')"><br>
<input type="button" value=" + " style="height:30; width:30; font-size:20;" onClick="push('+')">
<input type="button" value=" - " style="height:30; width:30; font-size:20;" onClick="push('-')">
<input type="button" value=" * " style="height:30; width:30; font-size:20;" onClick="push('*')">
<input type="button" value=" / " style="height:30; width:30; font-size:20;" onClick="push('/')">
<input type="button" value=" . " style="height:30; width:30; font-size:20;" onClick="push('.')">
<input type="button" value=" ( " style="height:30; width:30; font-size:20;" onClick="push('(')">
<input type="button" value=" ) " style="height:30; width:30; font-size:20;" onClick="push(')')">
<br>
<br>
計算結果:<br>
<input type="text" name="ans" size="40" style="font-size:20; text-indent:20;"><br>
<br>
<input type="button" value="計算" style="height:30; width:100;" onClick="calc()"><br>
<br>
<input type="reset" value="リセット" style="height:30; width:100;"><br>
</form>
</body>
</html>
で、場合によってはエラーが出るんですが、
xhtmlとか、難しいのは使わなくて、
上のテキストボックスを打ち損じた時に、「backspace」ボタンで、
訂正できるようにしたいと思って、質問しています。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Visual Basic(VBA) visual basic初心者です。 visual studioで電卓を作成しています。 実行時にテ 1 2023/02/08 00:18
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- Visual Basic(VBA) Vba 電卓 一文字消すボタン 3 2022/05/04 13:40
- その他(パソコン・スマホ・電化製品) ワードでテキストボックス内の文字を連動させない方法 2 2023/02/09 16:56
- JavaScript javascript 文字列の最後から1文字削除したい 2 2022/06/02 11:22
- JavaScript HTMLでJavaScriptを使用してプログラムを作ります。 入力されたパスワードを取得して、パス 2 2022/10/18 01:05
- Excel(エクセル) Excel 文字列が数値に変更できない 4 2022/12/07 06:08
- Java Java 南京錠 2 2023/02/04 11:46
- Excel(エクセル) countif関数について質問 4 2022/06/14 12:11
- gooブログ Twitterの動画画面をgooブログに埋め込めない 4 2022/06/03 16:40
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
クリックさせたいが、click()が...
-
onclickが動作しない
-
VB.NETで<Input>タグ、<text...
-
onchangeイベントを強制的に発...
-
JavaScriptのfileオブジェクト...
-
インラインフレームから親ウィ...
-
onClickがinput type="image"だ...
-
javascriptでtextareaに文字列...
-
javaScriptの変数をJavaの変数...
-
return trueとreturn falseの用...
-
プルダウンで選択すると、DBの...
-
onClickとsubmitの処理順序
-
条件により、リンク先に画面遷...
-
ボタンを押すとチェックボック...
-
【jQuery】input nameの文字列...
-
Selectの中身をfor文で入れる
-
確認ダイアログの出し方(JavaS...
-
1つのform内に2つのsubmitボタ...
-
VB.NET DateTimeの型について
-
<input>の選択肢をプルダウンメ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
JavaScriptのfileオブジェクト...
-
クリックさせたいが、click()が...
-
javaScriptの変数をJavaの変数...
-
innerHTML内では改行は禁止?
-
VB.NETで<Input>タグ、<text...
-
BackSpaceしたい(QNo.2734284の...
-
formのfileの値をhiddenでも持...
-
onclickが動作しない
-
ボタンかリンクをクリックする...
-
WordpressのCocoonというテーマ...
-
フォームのNAMEを変数に格納し...
-
JavaScriptでの足し算処理について
-
インラインフレームから親ウィ...
-
タグ実験で
-
リスト追加
-
localStorage
-
javascriptでtextareaに文字列...
-
onClickがinput type="image"だ...
-
ボタンで配列に代入
おすすめ情報
