0

以下に示すような一連のテキスト ボックスがあり、テキスト ボックスをクリックしたときにカーソルを無効にし、その値を「X」と「」の間で切り替える必要があります。これは私が書いたコードです：

HTML コード:

<input type="text" name="loan1" id="crossCheck1" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1' style=" width: 13px; height:13px; border-style:none;font-weight:bold; font-family:Arial Narrow; font-size:14px; color:#000000;margin-left:85px;cursor:hand"/>

<input type="text" name="loan2" id="crossCheck2" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1' style=" width: 13px; height:13px; border-style:none;font-weight:bold; font-family:Arial Narrow; font-size:14px; color:#000000;margin-left:85px;cursor:hand"/>

<input type="text" name="loan3" id="crossCheck3" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1' style=" width: 13px; height:13px; border-style:none;font-weight:bold; font-family:Arial Narrow; font-size:14px; color:#000000;margin-left:85px;cursor:hand"/>

Javascript:

$(document).ready(function() {
        $( ".crossCheck" ).click(function() {

            var cross =  $('#crossCheck1').val();
            var check = 'X' ;
            if(cross == "" ){
                document.getElementById("crossCheck1").value= check;
            }else{
                document.getElementById("crossCheck1").value= '';
            }

        });  
});

1. ここでは、コンテンツが変更されたときにカーソルが表示されることがあります。カーソルを削除する方法を教えてください。

2.クリックしたテキストボックスの値だけを変更する方法を教えてください。

デモHere

アップデート：

テキストボックスにカーソルを入れたくないのですが、完全に削除することはできますか

4

3 に答える 3

0

編集済み

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
jQuery(document).ready(function() {
        jQuery(".crossCheck").click(function() {
            var cross =  jQuery(this);
            var check = 'X' ;
            if(cross.val() == "" ){
                cross.val(check);
                cross.css("cursor","default");
            }else{
                cross.val('');
                cross.css("cursor","none");
            }
        });  
  });
  </script>
</head>
<body>
<input type="text" name="loan1" id="crossCheck1" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1'/>

<input type="text" name="loan2" id="crossCheck2" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1' />

<input type="text" name="loan3" id="crossCheck3" class="crossCheck" onfocus="this.blur()" readonly="readonly" maxlength='1'/>
</body></html>

私は英語が下手なので、あなたを本当に理解していませんが、このコードは、空のときにカーソルを非表示にし、入力に「X」が含まれているときに元に戻します。

于 2013-08-29T06:32:35.503 に答える