< script type = "text/javascript" >
$(function() {
debugger;
$(".price").click(function() {
var result = $(this).find('.figure').text();
var result_t = $('.title').text();
$('#text').html('<form action="" method="">' +
'Car Model Name : ' + result_t + '<br>' + '<br>' +
'Price : ' + result + '<br>' + '<br>' +
' : First Name' + '<input type="text" value="" />' + '<br>' + '<br>' +
' : Last Name' + '<input type="text" value="" />' + '<br>' + '<br>' +
' : Mobile Number' + '<input type="text" value="" />' + '<br>' + '<br>' +
'<input type="submit" value="Send Quote" />' +
'</form>');
$('#modal').modal();
return false;
});
}); < /script><a class="inventory" href="http://prospectingdesk.com/demo/inventory-listing.html">
<div class="title">2009 Porsche Boxster Base Red Convertible</div>
<img src="./Automotive Car Dealership & Business HTML Template_files/car-2-200x150.jpg" class="preview" alt="preview">
<table class="options-primary">
<tbody>
<tr>
<td class="option primary">Body Style:</td>
<td class="spec">Convertible</td>
</tr>
<tr>
<td class="option primary">Drivetrain:</td>
<td class="spec">RWD</td>
</tr>
<tr>
<td class="option primary">Engine:</td>
<td class="spec">2.9L Mid-Engine V6</td>
</tr>
<tr>
<td class="option primary">Transmission:</td>
<td class="spec">5-Speed Manual</td>
</tr>
<tr>
<td class="option primary">Mileage:</td>
<td class="spec">26,273</td>
</tr>
</tbody>
</table>
<table class="options-secondary">
<tbody>
<tr>
<td class="option secondary">Exterior Color:</td>
<td class="spec">Guards Red</td>
</tr>
<tr>
<td class="option secondary">Interior Color:</td>
<td class="spec">Platinum Grey</td>
</tr>
<tr>
<td class="option secondary">MPG:</td>
<td class="spec">20 city / 30 hwy</td>
</tr>
<tr>
<td class="option secondary">Stock Number:</td>
<td class="spec">590271</td>
</tr>
<tr>
<td class="option secondary">VIN Number:</td>
<td class="spec">WP0AB2A74AL060306</td>
</tr>
</tbody>
</table>
<img src="./Automotive Car Dealership & Business HTML Template_files/carfax.png" alt="carfax" class="carfax">
<div class="price"><b>Price:</b>
<br>
<div class="figure">$34,995
<br>
</div>
<div class="tax">Plus Sales Tax</div>
</div>
<div class="view-details gradient_button"><i class="fa fa-plus-circle"></i> View Details</div>
<div class="clearfix"></div>
</a>
我有一个名为inventory的类。如果我点击class = price我需要一个弹出窗口，其中包含。我需要获取该特定元素的标题和价格。 我已经给出了以下代码
使用以下javascript如果我运行我将获得该整页的所有标题。
答案 0 :(得分：0)
尝试
$(function() {
$(".price").click(function() {
var result = $(this).find('.figure').text();
var result_t = $(this).siblings('.title').text();
$('#text').html('<form action="" method="">' +
'Car Model Name : ' + result_t + '<br>' + '<br>' +
'Price : ' + result + '<br>' + '<br>' +
' : First Name' + '<input type="text" value="" />' + '<br>' + '<br>' +
' : Last Name' + '<input type="text" value="" />' + '<br>' + '<br>' +
' : Mobile Number' + '<input type="text" value="" />' + '<br>' + '<br>' +
'<input type="submit" value="Send Quote" />' +
'</form>');
$('#modal').modal();
return false;
});
});<script type="text/javascript" src="//code.jquery.com/jquery-1.11.1.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/css/bootstrap.css">
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.0/js/bootstrap.js"></script>
<a class="inventory" href="http://prospectingdesk.com/demo/inventory-listing.html">
<div class="title">2009 Porsche Boxster Base Red Convertible</div>
<img src="./Automotive Car Dealership & Business HTML Template_files/car-2-200x150.jpg" class="preview" alt="preview">
<table class="options-primary">
<tbody>
<tr>
<td class="option primary">Body Style:</td>
<td class="spec">Convertible</td>
</tr>
<tr>
<td class="option primary">Drivetrain:</td>
<td class="spec">RWD</td>
</tr>
<tr>
<td class="option primary">Engine:</td>
<td class="spec">2.9L Mid-Engine V6</td>
</tr>
<tr>
<td class="option primary">Transmission:</td>
<td class="spec">5-Speed Manual</td>
</tr>
<tr>
<td class="option primary">Mileage:</td>
<td class="spec">26,273</td>
</tr>
</tbody>
</table>
<table class="options-secondary">
<tbody>
<tr>
<td class="option secondary">Exterior Color:</td>
<td class="spec">Guards Red</td>
</tr>
<tr>
<td class="option secondary">Interior Color:</td>
<td class="spec">Platinum Grey</td>
</tr>
<tr>
<td class="option secondary">MPG:</td>
<td class="spec">20 city / 30 hwy</td>
</tr>
<tr>
<td class="option secondary">Stock Number:</td>
<td class="spec">590271</td>
</tr>
<tr>
<td class="option secondary">VIN Number:</td>
<td class="spec">WP0AB2A74AL060306</td>
</tr>
</tbody>
</table>
<img src="./Automotive Car Dealership & Business HTML Template_files/carfax.png" alt="carfax" class="carfax">
<div class="price"><b>Price:</b>
<br>
<div class="figure">$34,995
<br>
</div>
<div class="tax">Plus Sales Tax</div>
</div>
<div class="view-details gradient_button"><i class="fa fa-plus-circle"></i> View Details</div>
<div class="clearfix"></div>
</a>
<div id="modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body" id="text">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>