PHP 使用 Javascript 生成文本框操作答案

【问题标题】：PHP generated textbox operation with JavascriptPHP 使用 Javascript 生成文本框操作
【发布时间】：2009-05-28 03:07:27
【问题描述】：

我正在使用文本框让用户更改电子商务网站中的数量，例如，http://nordschleife.metaforix.net/118/118/index.php/sony.html

我希望解决两个问题：

在目录视图（例如上一个 URL 中的目录视图）中，向上和向下箭头仅适用于第一个文本框。所有后续条目都不起作用。
点击箭头后，页面跳转到顶部，这也不是我想要的。

PHP 用于生成条目，jQuery 用于操作。

页面的源文件在这里http://www.mediafire.com/?sharekey=9df4aef22a728de5c2b435915e8821d7e04e75f6e8ebb871

【问题讨论】：

以后试试 pastebin（或类似的）作为你的源代码。

标签： php javascript jquery html

【解决方案1】：

1：您可以只为所有箭头创建一个脚本，而不是为每个箭头单独注册一个事件。使箭头看起来像这样：

<a id="upImg_705" ... rel="qty_705" class="uparrow">
<input id="qty_705" class="input-text qty" type="text" value="1" maxlength="12" name="qty"/>
<a id="downImg_705" ... rel="qty_705" class="downarrow">

然后将这些函数注册为点击事件处理程序：

$('.uparrow').live("click", function() { 
   var rel = $(this).attr('rel');
   var textbox = document.getElementById(rel);
   textbox.value = parseInt(textbox.value)+1;
   return false;
}
$('.downarrow').live("click", function() { 
   var rel = $(this).attr('rel');
   var textbox = document.getElementById(rel);
   textbox.value = parseInt(textbox.value)-1;
   return false;
}

2：为防止进入页面顶部，请在链接中使用 href="javascript:void(0);" 而不是 href="#"。或者，您的 onclick 方法可能会返回 false 以阻止默认操作（即更改网页的位置）。

【讨论】：

【解决方案2】：

使用 jQuery 的 live() 创建将在通过 AJAX 更新更改页面时重新应用的事件。
event.preventDefault() 会阻止这个。

【讨论】：