【问题标题】:How to put text in a select class?如何将文本放在选择类中?
【发布时间】:2019-08-14 01:58:06
【问题描述】:

我正在尝试将文本放入选择类中。

下面是代码;

    <div class="col-xs-12 col-sm-9">        
<select class="form-control col-l10 col-m7 col-s7 esw-select ng-pristine ng-invalid ng-invalid-required ng-touched" ng-class="{'is-invalid': shipping_subform.$submitted &amp;&amp; shipping_subform.shippingRegion.$invalid}" id="Shipping_Territory" required="" ng-options="region.code  as region.name for region in regions" ng-model="userOrder.Shipping.Address.Region" name="shippingRegion" tooltip="Please select a province" tooltip-toggle=" shipping_subform.$submitted===true &amp;&amp; shipping_subform.shippingRegion.$invalid===true" esw-google-analytics-blur="">

<option value="" class="ng-binding">Select a province</option>
<option value="0" label="Ontario">Ontario</option>
<option value="1" label="British Columbia">British Columbia</option><option value="2" label="Manitoba">Manitoba</option>
<option value="3" label="Alberta">Alberta</option>
<option value="4" label="New Brunswick">New Brunswick</option>
<option value="5" label="Newfoundland and Labrador">Newfoundland and Labrador</option>
<option value="6" label="Northwest Territories">Northwest Territories</option>
<option value="7" label="Nova Scotia">Nova Scotia</option><option value="8" label="Nunavut">Nunavut</option>
<option value="9" label="Prince Edward Island">Prince Edward Island</option>
<option value="10" label="Quebec">Quebec</option>
<option value="11" label="Saskatchewan">Saskatchewan</option>
<option value="12" label="Yukon">Yukon</option>
</select>        <!-- ngIf: shipping_subform.$submitted && shipping_subform.shippingRegion.$invalid -->    
</div>

我尝试了以下方法;但是,当我点击提交按钮时,它说请选择一个省份。

这可行,但在单击提交按钮时实际上不起作用;

document.querySelector('#Shipping_Territory [label= Ontario]').selected = true;

据说我必须使用angular,但我不知道在triggerHandler中放什么。

 var e = document.getElementById("Shipping_Territory");
  e.value = "Ontario";
  var $e = angular.element(e);
  $e.triggerHandler('??');

我在 triggerHandler 中尝试过,更改、更改、选择、选择,但它只是将选择下拉列表变为空白。

感谢您的帮助。

【问题讨论】:

    标签: javascript angularjs dom


    【解决方案1】:

    为标签添加一个id

    <select id="selectedOption" class="form-control col-l10 col-m7 col-s7 esw-select ng-pristine ng-invalid ng-invalid-required ng-touched" ng-class="{'is-invalid': shipping_subform.$submitted &amp;&amp; shipping_subform.shippingRegion.$invalid}" id="Shipping_Territory" required="" ng-options="region.code  as region.name for region in regions" ng-model="userOrder.Shipping.Address.Region" name="shippingRegion" tooltip="Please select a province" tooltip-toggle=" shipping_subform.$submitted===true &amp;&amp; shipping_subform.shippingRegion.$invalid===true" esw-google-analytics-blur="">
    

    并使用以下方法获取 selectedOption 的索引:-

    document.getElementById("selectedOption").options.selectedIndex     
    

    希望对你有帮助!

    【讨论】:

    • 这没有帮助,我想我必须以有角度的方式来做。另外我将如何输入文本,你所做的就是获取索引。
    【解决方案2】:

    我成功使用了以下内容;

    var e = document.getElementById("Shipping_Territory");
      e.value = 2;
      var $e = angular.element(e);
      $e.triggerHandler('change');
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-02-05
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多