修改代码以发布到函数 dhtml/java/ajax

Question

任何人都可以帮助更改此代码以发布功能吗？ 例子：

http://jsfiddle.net/9C2g5/

代码：

<div id="address-wrap">
<div id="report-address">3719 COCOPLUM CIR <br>Unit: 3548<br>COCONUT CREEK, FL 33063</div>
<div id="report-button">
<form action="report.html">
<input name="property-id[]" type="text" class="property-id" value="64638716">
<input name="submit" type="submit" value="View Report" class="view_report">
</form>
</div>
<div id="clear"></div>
</div>
<div id="address-wrap">
<div id="report-address">3927 COCOPLUM CIR <br>Unit: 35124<br>COCONUT CREEK, FL 33063</div>
<div id="report-button">
<form action="report.html">
<input name="property-id[]" type="text" class="property-id" value="64638744">
<input name="submit" type="submit" value="View Report" class="view_report">
</form>
</div>
<div id="clear"></div>
</div>
<div id="address-wrap">
<div id="report-address">3949A COCOPLUM CIR <br>Unit: A<br>COCONUT CREEK, FL 33063</div>
<div id="report-button">
<form action="report.html">
<input name="property-id[]" type="text" class="property-id" value="64639105">
<input name="submit" type="submit" value="View Report" class="view_report">
</form>
</div>
<div id="clear"></div>
</div>
<div id="address-wrap">
<div id="report-address">3949 COCOPLUM CIR <br>Unit: 3602<br>POMPANO BEACH, FL 33063</div>
<div id="report-button">
<form action="report.html">
<input name="property-id[]" type="text" class="property-id" value="64639106">
<input name="submit" type="submit" value="View Report" class="view_report">
</form>
</div>
<div id="clear"></div>
</div>
<div id="address-wrap">
<div id="report-address">3949 COCOPLUM CIR <br>Unit: 3603<br>COCONUT CREEK, FL 33063</div>
<div id="report-button">
<form action="report.html">
<input name="property-id[]" type="text" class="property-id" value="64639107">
<input name="submit" type="submit" value="View Report" class="view_report">
</form>

那个帖子到：

$(document).ready(function(e) {
$("input[type=submit]").click(function(e) {
var propertyid = $(this).prevAll("input").first().val();
alert(propertyid);
});    
});

例子：

http://jsfiddle.net/9C2g5/

我们怎样才能改变这种正确的方式来发布到函数？？

Answer 1

我想这就是你要找的（如果不是，请尽量让你的问题更明确）：

为每个按钮定义一个单独的函数。

<script>
    function quantity() {
        var propertyid = $(this).prevAll("input").first().val();
        alert(propertyid);    
    }
</script>

然后，将每个按钮定义为input，并将type 属性设置为button 而不是submit。例如。

<input name="submit" type="button" value="View Report" onclick="quantity.apply(this)" class="view_report">

或者，quantity 函数可以定义为：

<script>
    function quantity(element) {
        var propertyid = $(element).prevAll("input").first().val();
        alert(propertyid);    
    }
</script>

按钮可以指定为：

<input name="submit" type="button" value="View Report" onclick="quantity(this)" class="view_report">

唯一的区别是第一种方式，你可以使用this访问目标元素。

但是，这两种方式都不是推荐的方式。将 JS 代码与 HTML 混合被认为是不好的做法。您可以在 google 上搜索Separation of concern 以获取更多信息。您目前正在做的是正确的做法（可能需要应用一些小的更改，例如replacing 类型为button 的“提交”类型）。