0

次のような単純な HTML ページがあるとします。

<html>
  <head>...</head>

  <body>
    <input type="text" id="mytextarea" />
    <input type="button" id="button1" onClick="..." />
    <input type="button" id="button2" onClick="..." />
  </body>
</html>

id="mytextarea"ボタン 1 とボタン 2がテキストに対して異なる操作を引き起こすという知識がある場合、HTML ページに大きく結合されたコードを作成せずに、JavaScript 関数でテキスト フィールド内のテキストにアクセスする最良の方法は何ですか?

例として、テキスト フィールドに 2 進数を期待しているとします。ボタン 1 はそれを整数の 10 進数に変換しますが、ボタン 2 はそれを分数の 10 進数に変換します。JavaScript コードを HTML ページに密結合せずにこれを処理するにはどうすればよいですか? document.getElementById('mytextarea')JavaScript 関数自体でa を使用せずに、mytextarea のデータを JavaScript コードに送信する方法はありますか?

はっきりさせたほうがいいかもしれませんが、

を使用する代わりの方法を探しているわけではありませんgetElementById。結合せずに HTML ページでテキスト フィールドを使用できる JavaScript コードを記述する方法を探しています。つまり、(1) JavaScript 関数が HTML ページ内のデータに対して作業を実行でき、(2) JavaScript 関数を別のページに移動できるように、JavaScript 関数と HTML ページを作成する方法を知りたいです。HTMLページとそこで使用され、上記の機能を変更することなく。

4

3 に答える 3

1

これがあなたが望むものだと思います：

最初に、引数として textarea 要素を渡すことができる Textarea というオブジェクトを作成します。

function Textarea(textarea) {
    this.container = textarea;
    this.value = textarea.value
};

次に、 のすべてのインスタンスで共有されるメソッドを追加できますTextarea object。

Textarea.prototype.ChangeValue = function(){
    console.log( 'Please add your ' + this.value );
};

このようにして、必要に応じて渡しmytextareaて変更することができます。これにより、必要に応じて他のテキストエリアや他のプロジェクトでオブジェクトのプロパティとメソッドを再利用できます。

t = new Textarea(document.getElementById('mytextarea'));
t.ChangeValue();

デモ: http://jsfiddle.net/SQ2EC/

于 2012-10-26T19:26:00.287 に答える
0

操作対象の要素について関数に通知する何らかの方法が必要なため、2 つの簡単なオプションがあります。次のように、関数を呼び出すときに、要素への参照をパラメーターとして渡すことができます。

onclick="manipulate(document.getElementById('mytextarea'))"

idまたは、属性値のみを渡すこともできます。

onclick="manipulate('mytextarea')"

その場合、関数は を使用する必要がありますdocument.getElementById()が、そのパラメーターでは、組み込みの文字列ではありません。

最初のアプローチは、他の方法でも参照を構築できるという意味でより柔軟ですdocument.getElementsByTagName('textarea')[0]。

両方の種類のパラメーターを処理できるように関数を作成することで、アプローチを組み合わせることができます。たとえば、最初にその引数が文字列型であるかどうかをチェックしdocument.getElementById()、そうである場合はそれを使用し、そうでない場合は要素への参照であると期待できます。また、取得または構築したものが実際にtextarea要素への参照であることをテストして、おそらく関数内でいくつかの健全性チェックを行う必要があります。

于 2012-10-26T19:37:55.313 に答える
-2

私はあなたがやりたいことを正確に取得しますが、ここでは変更イベントでテキストボックスの値を取得できます 

<script>
         $(document).ready(function () {
             $('input[id$=mytextarea]').change(function () {
                 alert($(this).val());
                 .............
                 now you have got the value so convert it to decimal and do other stuff
             });
         });
    </script>
于 2012-10-26T19:00:46.857 に答える