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"考虑到 button1 和 button2 导致对文本的不同操作，在不创建与 HTML 页面高度耦合的代码的情况下，使用 JavaScript 函数访问文本字段中文本的最佳方法是什么？

举个例子，假设我期望文本字段中有一个二进制数，并且 button1 会将其转换为整数十进制数，但按钮 2 会将其转换为小数十进制数。如何在不将 JavaScript 代码紧密耦合到 HTML 页面的情况下处理这个问题？有什么方法可以将 mytextarea 中的数据发送到 JavaScript 代码，而不必document.getElementById('mytextarea')在 JavaScript 函数本身中使用 a ？

也许我应该澄清一下，

我不是在寻找 using 的替代方法getElementById，而是在寻找一种编写 JavaScript 代码的方法，该代码可以在 HTML 页面中使用文本字段而不与它耦合。换句话说，我想知道如何编写 JavaScript 函数和 HTML 页面，以便 (1) JavaScript 函数可以对 HTML 页面中的数据执行工作，以及 (2) JavaScript 函数可以移动到另一个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

由于您需要某种方式来通知函数有关要操作的元素，因此有两个简单的选项。您可以在调用函数时将元素的引用作为参数传递，如

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 回答