Question

我想在进入textarea时立即显示我可以使用的提交按钮

<input type="submit" id="submit" name='sub' value="Transfer" style="visibility: hidden" />

有没有php或javascript的解决方案？

Brettz解决方案：

<html>
<head></head>
<form>
<input type="submit" id="submit" name='sub' value="Transfer" style="visibility: hidden" />
<textarea id="mytextarea"></textarea>

<script type="text/javascript">
function addEvent (el, type, listener) {
    if (el.addEventListener) {
        el.addEventListener(type, listener, false);
    }
    else if (el.attachEvent) {
        el.attachEvent('on'+type, listener);
    }
    else {
        el['on'+type] = listener;
    }
}
addEvent(document.getElementById('mytextarea'), 'input', function () {
    document.getElementById('submit').style.visibility = 'visible';
});
</script>
</form>
</html>

Answer 1

<input type="submit" id="submit" name='sub' value="Transfer" style="visibility: hidden" />
<textarea id="mytextarea"></textarea>
<script type="text/javascript">
function addEvent (el, type, listener) {
    if (el.addEventListener) {
        el.addEventListener(type, listener, false);
    }
    else if (el.attachEvent) {
        el.attachEvent('on'+type, listener);
    }
    else {
        el['on'+type] = listener;
    }
}
// Change "focus" to "keypress", if you only want to show the button
//  as soon as the user starts typing, rather than immediately 
//  after they click into the textbox. "input" might be more appealing
//  but this will not work in older browsers. See 
//  http://help.dottoro.com/ljhxklln.php
addEvent(document.getElementById('mytextarea'), 'focus', function () {
    document.getElementById('submit').style.visibility = 'visible';
});
</script>

注意我添加了一个id为“mytextarea”的textarea：

......您当然可以根据自己的姓名或需求进行更改。

amolv的解决方案便于快速建立页面。但内联JavaScript（以及内联格式或CSS）通常不赞成实际应用程序，因为它更清晰的页面结构（HTML）与行为分离（通常是JavaScript，尽管HTML5正在添加{{1可以让你在HTML的特殊部分中分离行为的元素。

将脚本（和样式）移动到单独的页面，还允许浏览器缓存（记住）脚本，而无需在用户访问您站点上可能重用相同代码的其他页面时重新加载脚本。因此，您的服务器只需要提供原始HTML（首次下载后），而不需要将所有脚本文本混合在一起，从而加快将页面内容传递给用户。

Answer 2

<textarea rows="" cols="" onfocus="document.getElementById('submit').style.visibility ='visible'" ></textarea>

<input type="submit" id="submit" name='sub' value="Transfer" style="visibility: hidden" />

Answer 3

您可以使用jQuery轻松完成此操作。

$('#textToSubmit').focus(function(){
    $('#submit').css('visibility','visible');    
});

http://jsfiddle.net/CCuVY/1/

编辑：在下面回答您的评论。

您需要将其包装在文档就绪函数中，所以

$(document).ready(function() {
    // put the rest of the code here.
})

这也需要放在<script type="text/javascript">标记中的<head>标记中，或放在结束</body>标记之前。

或者您可以将其放在脚本文件中。

http://www.learningjquery.com/2006/09/introducing-document-ready

Answer 4

更新以下是JSFIDDLE

上您的答案的实时演示演示

Answer 5

我不完全确定你的意思，但无论如何要在你的情况下再次显示按钮你会删除style =“visibility：hidden”

你可以使用像jquery这样的东西来使你的表格有一些影响，并使一些css看起来有点酷。

Answer 6

您可以对特定文本框/文本区域使用按键事件，并且每次确保文本区域中包含一些文本。焦点不会确保文本框有一些文本。或者你可以在焦点上使用模糊，但与keyppress相比它不会那么好用

$('#yourtextarea').bind('keypress', function() {

  var val = $(this).val();

  if(val != "")

  {

    //show your submit button
    //you can have extra check to make sure submit button is visible or not, if not visible than make it visible

  }
  else

  {

     //hide your submit button

  }


});

你需要加载jquery。给定的功能应该在document.ready

进入显示提交按钮的文本区域时

6 个答案: