简体   繁体   English

我如何获得文本区域的价值?

[英]How can i get value of text area?

i have two files 1)index.php and 2)code.js 我有两个文件1)index.php和2)code.js

now code in index.php is below 现在index.php中的代码在下面

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<link href="http://web.guru99.com/lib/codemirror.css" rel="stylesheet" />
<script type="text/javascript" src="code.js"></script>
<style type="text/css">
    .CodeMirror {
    border: 1px solid #eee;
    height: auto;
}
.CodeMirror-scroll {
    height: auto;
    overflow-y: hidden;
    overflow-x: auto;
}
</style>
</head>
<body>
Integer : whole numbers e.g. -3, 0, 69. The maximum value of an integer is platform-dependent. On a 32 bit machine, its usually around 2 billion. 64 bit machines usually have larger values. The constant PHP_INT_MAX is used to determine the maximum value.
<pre class="codeguru">say 'hi';</pre>
Let us now look at how PHP determines the data type depending on the attributes of the supplied data.
<pre class="codeguru">say 'hello';</pre>
Floating point numbers
<pre class="codeguru">say 'you r amazing';</pre>
Character strings
<pre class="codeguru">say 'i am fine';</pre>
</div>
<form class="hidden code-box" method="GET" name="sample">
<div dir="ltr"><textarea class="php" name="codeguru"></textarea></div>
<input type="submit" value="Run" onclick="execute();"/>
</br></br>
Output:</br></br>
    <textarea id="print-result" disabled="true" cols="77"></textarea></br>
</form></div>
</body>
</html>

and code.js file contain code is given below 和code.js文件包含代码如下

$(document).ready(function() 
{
    $('pre.codeguru').each(function() 
    {
            var pre = this;
            var form = $('form[name=sample]').clone();
            $(form).removeAttr('name');
            $(form).removeClass('hidden');
            $($(form).find('textarea')[0]).val($(pre).text());
            var id = $(pre).attr('id');
            $(form).find('div textarea[name=code]').first().attr('id', id);
        $(pre).replaceWith(form);
        });
        window.editors = [];
        $('textarea[name=codeguru]').each(function() 
        {
            window.editor = CodeMirror.fromTextArea(this, 
            {
                lineNumbers: true,
                matchBrackets: true,
                mode: "application/x-httpd-perl",
                tabMode: "shift"
             });
                editors.push(editor);
        });

});
function execute() {
            p5pkg.CORE.print = function(List__) {
                var i;
                for (i = 0; i < List__.length; i++) {
                  document.getElementById('print-result').value += p5str(List__[i])
                }
                return true;
            };
            p5pkg["main"]["v_^O"] = "browser";
            p5pkg["main"]["Hash_INC"]["Perlito5/strict.pm"] = "Perlito5/strict.pm";
            p5pkg["main"]["Hash_INC"]["Perlito5/warnings.pm"] = "Perlito5/warnings.pm";
            var source = editor.getValue();
            alert(source);
            var pos = 0;
            var ast;
            var match;
            document.getElementById('print-result').value = "";
            try {
                var start = new Date().getTime();
                var js_source = p5pkg["Perlito5"].compile_p5_to_js([source]);
                var end = new Date().getTime();
                var time = end - start;
                // run
                start = new Date().getTime();
                eval(js_source);
                end = new Date().getTime();
                time = end - start;
            }
            catch(err) {
                //document.getElementById('log-result').value += "Error:\n";
                  }
        }

everything is run fine in my code. 一切都在我的代码中运行良好。 in code.js pre tags are replaced by textarea and the code in textarea should be run because this project is of online perl editor. 在code.js中,pre标记被textarea替换,并且应该运行textarea中的代码,因为该项目是在线perl编辑器。 so now my problem is i have alert the value of text area by this code 所以现在我的问题是我已经通过此代码警告文本区域的值

var source = editor.getValue();
            alert(source);

but that gives the blank pop up. 但这会弹出空白。 so what i have to do for retrieve current value of textarea? 所以我必须做些什么来检索textarea的当前值?

You have created more than one editor in this code. 您在此代码中创建了多个编辑器。 These seems to be stored in editors array. 这些似乎存储在editors数组中。 Now you want to execute execute() by clicking a button, but you're not telling JS, which editor value you want to alert. 现在要执行execute()通过点击一个按钮,但你不能告诉JS,你要提醒编辑器值。

The value of the first editor on the page can be reached like this: 可以像这样到达页面上第一个编辑器的值:

var source = editors[0].getValue();

editor.getValue() is supposed to give you the value of the last editor in the editors array. editor.getValue()应该为您提供editors数组中最后一个编辑器的值。

Since you have a separate button for each editor, you can pass the editor's index in the editors array to execute() function. 由于每个编辑器都有一个单独的按钮,因此可以将编辑editors数组中的editors器索引传递给execute()函数。

At first, remove the onclick attribute from the button input, then: 首先,从按钮输入中删除onclick属性,然后:

After $('pre.codeguru').each(); $('pre.codeguru').each(); , attach eventlisteners to buttons: ,将事件监听器附加到按钮:

var n = 0;
$('input[type=button]').each(function () {
        $(this).click(function (x) {
            return function () {
                execute(x);
            };
        }(n++))
    }
); 

And in the execute() : 并在execute()

function execute(idx) {
        ...
    var source = editors[idx].getValue();
    alert(source);
        ....    
}

UPDATE 更新

Updated the fiddle code to output to a corresponding field. 更新了小提琴代码以输出到相应的字段。

And here is an updated live demo . 这是一个更新的现场演示

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM