在div元素中调用JQuery函数

时间:2016-12-29 13:28:23

标签: javascript jquery html css

在我的html文件中是不可见的元素:

<div class="field">
     <div id="warring" style="color:red; display:none;">
        warrning text
     </div>
</div>

和功能:

function showStepsWarrning(){
  $('warring').show();
}

我需要在选项组件的if statement中调用此函数,尝试通过以下方式执行此操作:

<option #if(${show.value}) window["showStepsWarrning"]()#end>
  $!project.key.name
</option>

window["showStepsWarrning"]()不起作用。

如何解决我的问题?

2 个答案:

答案 0 :(得分:0)

您必须使用#按ID选择元素。 你的代码应该是:

function showStepsWarrning(){
    $('#warring').show();
}

答案 1 :(得分:0)

我认为你正在努力实现这一目标。我在选择选项并相应地更改警报颜色时调用 showStepsWarrnings()http://codepen.io/shivk/pen/ENqwRP

function showStepsWarrning1(){
  $('#warring').show();
  $("#warring").css("color", "red");

}

function showStepsWarrning2(){
  $('#warring').show();
  $("#warring").css("color", "blue");
}

function showStepsWarrning3(){
  $('#warring').show();
  $("#warring").css("color", "green");
}




var options = [{"value" : "1",
                "display" : "One",
                "fn" : function() { console.log("One clicked");alert("one");}
               },
               {"value" : "2",
                "display" : "Two",
                "fn" : function() { console.log($(this).val() +  " clicked"); showStepsWarrning1();}
               },
               {"value" : "3",
                "display" : "Three",
                "fn" : function() { console.log("Three clicked");showStepsWarrning2(); }
               },
               {"value" : "4",
                "display" : "Four",
                "fn" : function() { console.log("Four clicked");  showStepsWarrning3();}
               }];

var $select = $("select").on("click keyup", function() {
    var opt = this.options[this.selectedIndex];
    $(opt).data("fn").call(opt);
});

$.each(options, function(i, val) {
    $select.append(
        $("<option/>").attr("value", val.value)
                      .text(val.display)
                      .data("fn", val.fn)
    );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>


<select></select>


<div class="field">
     <div id="warring" style="color:red; display:none;">warrning text</div>
</div>