我有一个 Bootstrap 模式,当您单击它时会显示 Gallery 的图像。我想通过点击每张图片来更改输入值,并将它们的 Url 放在 input text 上以进行 submit 。但它不起作用,输入文本的值不会改变。为什么?
@model IEnumerable<tourism.Models.Gallery>
<input type="text" name="imgUrl" id="index-img" style="width: 100%;" value="url" />
<div class="container">
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" id="myBtn">Choose Image</button>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Gallery</h4>
</div>
<div class="modal-body">
<div class="row">
@foreach (var item in Model)
{
<div class="col-lg-2 col-sm-3 col-xs-4">
<a href="#" onclick="(function () { ('input[name=imgUrl]').val()=@Html.DisplayFor(modelItem => item.Url); })()" class="close" data-dismiss="modal"><img src="@Html.DisplayFor(modelItem => item.Url)" class="thumbnail img-responsive" alt="@Html.DisplayFor(modelItem => item.Alt)"></a>
</div>
}
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
用于将 Url 从模型传递到输入文本的 jQuery 代码(来自上面的代码):
<a href="#" onclick="(function () { ('input[name=imgUrl]').val()=@Html.DisplayFor(modelItem => item.Url); })()" class="close" data-dismiss="modal"><img src="@Html.DisplayFor(modelItem => item.Url)" class="thumbnail img-responsive" alt="@Html.DisplayFor(modelItem => item.Alt)"></a>
最佳答案
更改链接以添加项目 url 的 data-
值(删除您的 onclick=...
)
<a href="#" data-url="@item.Url" class="image" .... >
然后添加脚本来处理链接的点击事件来更新输入
$('.image').click(function() {
$('#index-img').val($(this).data('url'));
});
关于javascript - ASP.NET MVC : Change input text value with jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34364941/