![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
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で質問しましょう!
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
innerHTML内では改行は禁止?
-
onclickが動作しない
-
formのfileの値をhiddenでも持...
-
クリックでテーブル内の背景色...
-
クリックさせたいが、click()が...
-
SendKeys()が一番最後に実行さ...
-
jQueryでshow/hideが上手く行か...
-
フォームの数値計算
-
iOSのみダブルタップが必要
-
<JavaScript>tableタグを入力不...
-
プルダウン 項目が多いので先頭...
-
ハイパーリンクを別ウインドウ...
-
ページ間で変数を保持したい
-
特定<table>内の<td>の色を変える
-
【jsp/Java】チェックボックス...
-
tabindexの取得
-
文字数を数える際に空白、改行...
-
submitするとなぜか2度実行する
-
jsで質問です。 ボタンが二つ存...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
javaScriptの変数をJavaの変数...
-
クリックさせたいが、click()が...
-
追加ボタンを押した際に ok ボ...
-
onclickが動作しない
-
innerHTML内では改行は禁止?
-
formのfileの値をhiddenでも持...
-
JSのボタンを複数う使うには
-
onClickがinput type="image"だ...
-
VB.NETで<Input>タグ、<text...
-
ボタンかリンクをクリックする...
-
ボタンをクリックするとテキス...
-
開いた子ウィンドウにあるボタ...
-
オンクリックで現在時刻の取得→...
-
JavaScriptのfileオブジェクト...
-
URL 判定
-
if構文
-
BackSpaceしたい(QNo.2734284の...
-
複数のテキストボックスの値の...
-
jQueryでshow/hideが上手く行か...
おすすめ情報