Question

我正在使用jquery mobile 1.4.2。我在我的页面中使用的代码在这里

<script>
 $(document).ready(function () {
 $(".hr").click(function(){
 $("#imgs").show();
 });
  });
 </script>
<div class="hr">click</div>
<div>
 <img src="http://www.inmomundo.com/oinmonm/plugins/searchbox/images/load_blu.gif" class="imgst" style="display:none;">
  <select name="im_c" id="im_c" data-mini="true">
  <option value="1">first</option>
  <option value="2">second</option>
  </select>

我希望上面的图像显示在选择选项中，即第一个旁边。链接到jsfiddle是 http://jsfiddle.net/Y8LtK/1/

Answer 1

如果我理解正确，你想在选择器上显示一个微调器，在按下测试（点击）按钮后给用户一些反馈。接近它的方法是在选择器中添加一个类，并在CSS位置适当地添加微调器。使用更多javascript事件来隐藏和显示微调器，并获得您正在寻找的行为。

JS

$(document).ready(function () {
  $(".hr").click(function () {
    $("#im_c").addClass("showSpinner");
  });
});

CSS

.showSpinner {
background: url("http://www.inmomundo.com/oinmonm/plugins/searchbox/images/load_blu.gif");
background-size: 1em;
background-repeat: no-repeat;
padding-left: 2em;
}

HTML

<button class="hr">Test</button>
<div>
<img src="http://www.inmomundo.com/oinmonm/plugins/searchbox/images/load_blu.gif" style="display:none;" width="16" height="16" name="imgstate" id="imgstate" class="imgstate" alt="cargando" />
<select data-mini="true" id="im_c">
    <option value="1">first</option>
    <option vakue="2">second</option>
</select>
</div>

更新：您没有包含任何jQuery Mobile库

如果您的选择器ID为im_c，则需要定位父div，以便选择器变为im_c-button

$("#im_c-button").addClass("showSpinner");

请参阅此jsfiddle：http://jsfiddle.net/beRoberto/dgvWC/

当我们点击链接时，如何在搜索框中显示图像？

1 个答案: