这是将生成的元素的剃刀代码
@{ k = 0; };
@foreach (var item in Model.Where(q=>q.isOrginal==true))
{
<tr>
<td>Starting Time</td>
<td>
@Html.Hidden("[" + i + "].isOrginal", true)
@Html.DropDownList("[" + i + "].StartingTime", new SelectList(ViewBag.StartingTime, "Value", "Text", item.StartingTime.ToString()), new { @class = "no-select dropdown", data_id= @k,id="starting-true" + @k, data_val="true" })
</td>
<td>Ending Time</td>
<td>
@Html.DropDownList("[" + i + "].EndingTime", new SelectList(ViewBag.EndingTime, "Value", "Text", item.EndingTime.ToString()), new { @class = "no-select dropdown", data_id = @k,id = "ending-true" + @k, data_val = "true" })
</td>
<td>Charges</td>
<td>
@Html.TextBox("[" + i + "].Charges", item.Charges, new { @class = "original", data_id = @k, id = "original-false" + @k })
</td>
</tr>
i++;
k++;
}
这是到目前为止的jquery代码
$(document).on('change', '.dropdown', function (e)
{
$('.dropdown').each(function (i, obj) {
var ii = $(obj).attr("data-val");
if (ii == "true") {
console.log(ii);
}
});
});
假设页面上有8个下拉列表
st en
st en
st en
st en
无论哪个下拉我onchanges我想从下一个下拉列表开始循环到最后一个。如果它是最后一个我不想循环通过任何东西。我怎么能做到这一点?
答案 0 :(得分:0)
尝试以下代码(未根据您的方案进行测试但应该有效)
$(".dropdown").on("change",function(e){
var nextdps = $(this).nextAll(".dropdown");
if(!nextdps){
nextdps = [];
}
var nextTrs = $(this).parents("tr").nextAll("tr");
$.each(nextTrs,function(i,elm){
var trDps= $(elm).find(".dropdown");
if(trDps){
nextdps.push(trDps);
}
});
$.each(nextdps,function(i,elm){
var ii = $(elm).attr("data-val");
if (ii == "true") {
console.log(ii);
}
})
});
答案 1 :(得分:0)
你可以这样做。我将change
事件更改为click
,以便您点击任意字词,然后在red
中看到以下内容突出显示。
这样,只要设置了ID,就可以在代码中的任何位置添加下拉列表。
var id;
$(document).on('click', '.dropdown', function(e)
{
id = $(this).attr('id').split('dropdown').pop();
id = parseInt( id );
$('.dropdown').removeClass('red');
$('.dropdown').each( check );
});
function check( index )
{
if ( id == $('.dropdown').length -1 ) { return }
if ( index <= id ) { return }
$('.dropdown').get(index).classList.add('red');
// Do whatever you want here with `index`
}
&#13;
.red {
color: red;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dropdown" id="dropdown0">Zero</div>
<div class="dropdown" id="dropdown1">One</div>
<div class="dropdown" id="dropdown2">Two</div>
<div class="dropdown" id="dropdown3">Three</div>
<div class="dropdown" id="dropdown4">Four</div>
&#13;