使用bookmarklet更改文本框大小

时间:2013-12-24 04:50:48

标签: javascript forms bookmarklet

表单文本区域缩放器是一个书签,允许用户更改textarea的大小。 E.g。

javascript: (function() {
    var i, x;
    for (i = 0; x = document.getElementsByTagName("textarea")[i]; ++i) x.rows += 5;
})()

但我正在寻找一个可以让我更改文本框大小的书签。例如。在the following page我想增加名称和电子邮件输入框的大小。

3 个答案:

答案 0 :(得分:1)

据我所知,没有办法做到这一点。可以使用CSS resize:both; overflow: auto;,但这似乎不适用于各种浏览器。 (也许我doing something wrong)。

一种方法可能是用脏副本替换所有输入字段,但这似乎是破坏现有脚本(页面原生等)的候选者。作为一个例子,元素不再是“text”类型,如果本机脚本依赖于它,它就会被破坏。事件监听器会被破坏等等。

无论如何,如果仍然想要,快速的初稿也许可能是something like this

(function() {
    var x, n, i = 0,
        t = document.createElement('TEXTAREA');
    t.rows = 3;
    while ((x = document.getElementsByTagName('INPUT')[i])) {
        if (x.type === "text") {
            n = x.parentNode.insertBefore(t.cloneNode(), x);
            x.parentNode.removeChild(x); 
            n.id = x.id;   
            n.name = x.name;
            n.innerText = x.value;
        } else { 
            ++i;   
        }
    }
})();

或作为书签:

javascript:(function(){var x,n,i=0,t=document.createElement("TEXTAREA");t.rows=3;while((x=document.getElementsByTagName("INPUT")[i]))if(x.type==="text"){n=x.parentNode.insertBefore(t.cloneNode(),x);x.parentNode.removeChild(x);n.id=x.id;n.name=x.name;n.innerText=x.value}else++i})();

答案 1 :(得分:1)

这改变了我想要的输入字段:

javascript:(function(){var%20i,x;%20for(i=0;x=document.getElementsByTagName("INPUT")[i];++i)%20x.size%20+=%2035;%20})()

答案 2 :(得分:0)

我认为你接近它的方式并不是最好的方法。您的bookmarklet函数应该调用一些外部JavaScript,您应该将所有逻辑放在该脚本中。在这种情况下,调试脚本应该更容易。

请考虑以下示例代码:

<a href="javascript:(function(){  script=document.createElement('SCRIPT');script.src='http://path/to/your/JS';document.body.appendChild(script);})()"> This is a sample bookmarklet </a>

所以现在你所包含的全局JS文件应该包含你的JS和所有逻辑。完成后,使用插件执行上述步骤。这次在所需位置插入断点以调试代码。