Question

<!DOCTYPE html>
<html ng-app>

  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script type="text/javascript" src="upf.js"></script>
  </head>

  <body>
    <div align="center" style="width: 100%;">
      <div align="center" style="border-color: black; border-style: solid; width: 800px;">
        <h2 align="center">UPF PD DATA ENTRY!</h2>
        <p>
          <form id="myform" action="" method="post">
            <fieldset>
              <div ng-controller="IndustryCntrl">
                Industry:
                <select id="industry" ng-model="segments" ng-options="industry for (industry, segments) in Industries">
                  <option value=''>Select</option>
                </select>
                Segment:
                <select id="segment" ng-disabled="!segments" ng-model="margins" ng-options="segment for (segment,margin) in segments">
                  <option value=''>Select</option>
                </select>
                margin:
                <select id="margin" id="showhide_form" ng-disabled="!margins || !segments" ng-model="margin">
                  <option value=''>Select</option>
                  <option ng-repeat="margin in margins" value='{{margin}}'>{{margin}}</option>
                </select>
              </div>
            </fieldset>
          </form>
      </div>
    </div>
  </body>

</html>

我希望在使用jQuery或JavaScript选择下拉值之前禁用提交按钮。

Answer 1

使用Jquery，您可以使用以下代码：

＆＃13;

$('#submitorder').attr('disabled', 'disabled');

function updateFormEnabled() {
    if (verifyAdSettings()) {
        $('#submitorder').attr('disabled', '');
    } else {
        $('#submitorder').attr('disabled', 'disabled');
    }
}

function verifyAdSettings() {
    if ($('#ad_duration').val() != '' && $('#ad_type').val() != '') {
        return true;
    } else {
        return false
    }
}

$('#ad_duration').change(updateFormEnabled);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<form id="ad_form" method="post" action=""> 
    <p>
 
        <label for="ad_type" class="labelStrong">Advertising Type</label>
    </p>
    <p>
        <select id="ad_duration" name="ad_duration">
            <option value="" selected="selected">Select premium ad duration</option>
            <option value="weekly">Weekly</option>
            <option value="fortnightly">Fortnightly</option>
            <option value="monthly">Monthy</option>
        </select>
        <label for="ad_duration" class="labelStrong">Advertising Duration</label>
    </p>

    <p>
        <div id="calender">
        </div>
    </p>
    <p>
        <input type="submit" name="submit" value="Submit" id="submitorder" />
    </p>
</form>

＆＃13;

如何在选择下拉值之前禁用提交按钮

1 个答案: