Question

我的选择选项就是这样，

<select class="chosen">
    <option value='' disabled selected style='display:none;'>Add new criteria</option>                                          
    @foreach (var item in Model)
    {
       <option value="" onclick="ShowMessage(@item.Criteria);">@item.Criteria</option>
    }
</select>

foreach循环有大约20个值，我需要点击它们的单个值。我不能在select上使用onclick，因为值在foreach中。我的jquery

function ShowMessage(criteria) {
    alert(criteria);
}

让我知道使用什么而不是onclick=""因为不起作用......

Answer 1

由于您使用的是jquery，因此您应该使用它绑定change事件。

HTML 的

<select class="chosen">
    <option value='' disabled selected style='display:none;'>Add new criteria</option>                                          
    @foreach (var item in Model)
    {
       <option value="" data-criteria="@item.Criteria">@item.Criteria</option>
    }
</select>

脚本

$(document).ready(function() {
    $('.chosen').on('change', function(){
        var criteria = $(this).find('option:selected').data('criteria');
        //As per your current html, you can use .text() also 
        //var criteria = $(this).find('option:selected').text();
        alert(criteria);
    });
});

Answer 2

您必须使用change中的jQuery个活动。您的@foreach将发生如下变化。

注意：我认为您忘记将value="@item.Criteria"添加到option标记。

<select class="chosen">
    <option value='' disabled selected style='display:none;'>Add new criteria</option>                                          
    @foreach (var item in Model)
    {
       <option value="@item.Criteria">@item.Criteria</option>
    }
</select>

您在.change上添加了select事件，该事件会提醒值。

$('.chosen').change(function(){
   alert($(this).val());
});

＆＃13;

$('.chosen').change(function() {
  alert($(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="chosen">
  <option value='' disabled selected style='display:none;'>Add new criteria</option>
  <option value="Criteria1">Criteria1</option>
  <option value="Criteria2">Criteria2</option>
  <option value="Criteria3">Criteria3</option>

</select>

＆＃13;

Answer 3

在某些浏览器中单击选项元素将失败。您应该在select元素上绑定change事件，然后在其中选择选项：

$('select.chosen').change(function(){
   alert($(this).find('option:selected').text())
});

Answer 4

你能尝试如下： -

<option value="" onclick="ShowMessage('@item.Criteria');">@item.Criteria</option>

Answer 5

只需调用选择框的更改功能

$(".chosen").change(function(){
    alert($(this).val());
});

并且您也可以在不调用

等更改方法的情况下获取选择值

alert($(".chosen").val());

OnClick或内部选择

5 个答案: