Question

任何人都需要进行原型挑战？我是Prototype的新手，我正在努力做到以下几点。会在jQuery中执行此操作，但安装的唯一js库是Prototype。也许某人有一个可行的JavaScript解决方案？

从表单值中删除任何空格（之前和之后）
如果输入表单长度为3或更小，则隐藏所有行中的所有checkPrice.gif图像。

不确定使用Prototype是否可行。

<form method="get" id="searchForm" name="car" action="some-action">
<input type="text" value="Ford150" name="carPart" id="search" class="textContent">
</form>

<table border="1">
<tr>
<td class="description">Description:</td>
<td class="checkPrice"><p>Type:</p>
<p><a target="_blank" href="link.html"><img src="images/checkPrice.gif"></a></p>
</td>
</tr>

<tr>
<td class="description">Description:</td>
<td class="checkPrice"><p>Type:</p>
<p><a target="_blank" href="link.html"><img src="images/checkPrice.gif"></a></p>
</td>
</tr>
</table>

重复行

非常感谢任何能提供帮助的人！

Answer 1

我假设您的意思是“如果输入表格值长度为3或更小”，因为默认输入值不是数字。

function updateCheckPrice(event) {
    // $F() returns a string
    // String.strip() trims whitespace and returns a new string
    // String.length is a native property
    var length = $F(this).strip().length;

    // If length is 3 or less...
    var action = length <= 3 ? Element.hide : Element.show;

    // Pass the chosen show/hide function to every img element
    $$('img[src$=checkPrice.gif]').each(action);
}

document.observe('dom:loaded', function(){
    // Update as you type
    Event.observe('search', 'keyup', updateCheckPrice);
});

Answer 2

确定。用纯JS编写的修剪函数（来自http://blog.stevenlevithan.com/archives/faster-trim-javascript）：

function trim (str) {
var str = str.replace(/^\s\s*/, ''),
    ws = /\s/,
    i = str.length;
while (ws.test(str.charAt(--i)));
return str.slice(0, i + 1);
}

如何将字符串转换为数字：http://www.javascripter.net/faq/convert2.htm

如何使用Prototype访问元素的值： http://www.prototypejs.org/api/form/element/getValue

如何检查是变量 - 字符串：

 function is_string(input){
    return typeof(input)=='string';
 }

如何使用Prototype隐藏元素： http://www.prototypejs.org/api/element/hide

现在您已准备好自己解决任务！ ;）

使用Prototype或Javascript选择和隐藏元素

2 个答案: