Javascript 验证不带表单标记的下拉列表

我们提供一个选项供用户选择“品牌和型号”，然后点击“查看案例”按钮，根据所选选项，它将重定向到正确的url

在这里，如果我们直接点击“查看案例”，而不选择品牌和型号，它会重定向到错误的url，在这里，我们想为这两个下拉列表添加验证。我们这里没有使用任何表单标签

我的品牌
在自定义函数
geturlandedirec（）
中，您可以检查下拉列表是否有值，并使用自己的代码手动验证它们

像

函数geturlandirect（）
{
/*正在尝试此代码进行模型验证*/
if（jQuery（'brand_-select'）.val（）和&jQuery（'model_-select'）.val（））{
var brandmodelValue=jQuery（“#model_选择选项：selected”）.val（）；
//var finalUrl=“自定义-”+brandmodelValue+“.html”；
var finalUrl=”http://sbdev2.kidsdial.com:81/custom-“+brandmodelValue+”.html”；
jQuery（“#customcaseform”）.attr（'action'，finalUrl）；
jQuery（“#customcaseform”）.submit（）；
}否则{
if（jQuery（'#brand_select'）.val（））{
if（jQuery（'#brandmodel'）.find（'label.error'）.length）{
jQuery（“#brandmodel”）.find（'label.error'）.html（“请选择要继续的模型”）；
}否则{
jQuery（“#brandmodel”）.append（'请选择要继续的模型'）；
}
}
if（jQuery（'#model_select'）.val（））{
if（jQuery（'.custom_case'）.find（'.brand'）.find（'label.error'）.length）{
jQuery（'.custom_case'）.find（'.brand'）.find（'label.error'）.html（“请选择要继续的模型”）；
}否则{
jQuery（'.custom_case'）。find（'.brand'）。append（'请选择一个品牌，然后选择模型继续'）；
}
}
否则{
if（jQuery（'#brandmodel'）.find（'label.error'）.length）{
jQuery（“#brandmodel”）.find（'label.error'）.html（“请选择要继续的模型”）；
}否则{
jQuery（“#brandmodel”）.append（'请选择要继续的模型'）；
}
if（jQuery（'.custom_case'）.find（'.brand'）.find（'label.error'）.length）{
jQuery（'.custom_case'）.find（'.brand'）.find（'label.error'）.html（“请选择要继续的模型”）；
}否则{
jQuery（'.custom_case'）。find（'.brand'）。append（'请选择一个品牌，然后选择一个模型继续'）；
}
}
返回false；
}
}

---

在false上，您可以返回false，否则继续正常流程，您希望它重定向到该流程。

向默认选择的

选项添加一个值，就像这样
我的品牌

然后您有多个选项：

添加一个名为
custom--1.html
的文件作为404页面的排序

当在
geturlandedirec
函数中检测到默认值时，显示allert/error/something：

var brandmodelValue=jQuery（“#model_选择选项：selected”）.val（）

如果（brandmodelValue==-1）{
警报（'请先选择一个品牌！'）；
返回；
}

我是Js新手，请用相关代码更新答案，如果条件满足，请更新答案。谢谢，我尝试了你的代码，但结果仍然与在finalUrl变量中尝试分配完整url的结果相同<代码>”http://xxx.xxx.xxx/custom-“+brandmodelValue+”.html“

检查url，它是否被重定向到您希望它重定向的url。你是否在线上传了该文件，以便我查看该文件。为什么你不简单地在

My Brand

中添加一个值，并在

geturlandredirec

中处理该默认值？@Glufu我是JS新手，你能告诉我在

geturlandredirec

中需要使用什么代码吗

<div>

        <div>
          <select id="brand_select">
            <option value="">My Brand</option>
            <?php foreach ($brands as $key => $value) 
            {
            ?>
                 <option value="<?php echo $value->getCategoryId();?>"> <?php echo $value->getCategoryName();?></option>
            <?php 
            }
            ?>
          </select>
        </div>


        <div id="brandmodel">
          <select id="model_select">
            <option value="">My Model</option>
          </select>
        </div>        
        <div>


        <div>
            <a href="#" onclick="geturlandredirec()"><span> See Cases > </span> </a>
        </div>
      </div> 

      <div id="myDivLoader"></div>

      <script>
      var models = <?php echo json_encode($this->getbrandsArr()) ?>;
      jQuery(document).ready(function(){
        jQuery( "#brand_select" ).change(function() {
          var brandId = jQuery(this).val();      
           url="<?php echo Mage::getbaseUrl()?>custom-phone-cases/customcase/ajaxBrandmodel";
           new Ajax.Request(url, {
               method: 'POST',  

               onLoading: showLoad,
                 onFailure: function(response){
           },
          parameters: {
            id: brandId
          },
         onSuccess: function(response)
         { 
             jQuery( "#brandmodel" ).html(response.responseText);
             hideLoad();
         }
        }); 

       });      
    });
      function showLoad()
      {
       jQuery("#myDivLoader").html('<img src="<?php echo $this->getSkinUrl('images/opc-ajax-loader.gif') ?>" alt="Wait" />');
      }
      function hideLoad()
      {
       jQuery("#myDivLoader").html('');
      }
    function geturlandredirec()
    {           
      var brandmodelValue=jQuery( "#model_select option:selected" ).val();
      var finalUrl="custom-"+brandmodelValue+".html";
      jQuery('#customcaseform').attr('action',finalUrl);
      jQuery( "#customcaseform" ).submit();

       /* Trying this code for My Model Validation */
      var model_select = document.getElementById("model_select");
      if (model_select.value == "") 
      {
          document.getElementById('model_select').innerHTML="please select Model";
      }

    }
      </script>
</div>

function geturlandredirect()
{
    /* Trying this code for My Model Validation */

    if (jQuery('#brand_select').val() && jQuery('#model_select').val()) {
        var brandmodelValue=jQuery( "#model_select option:selected" ).val();
//var finalUrl="custom-"+brandmodelValue+".html";
        var finalUrl="http://sbdev2.kidsdial.com:81/custom-"+brandmodelValue+".html";
        jQuery('#customcaseform').attr('action',finalUrl);
        jQuery( "#customcaseform" ).submit();
    } else {
        if (jQuery('#brand_select').val()) {
            if (jQuery('#brandmodel').find('label.error').length) {
                jQuery('#brandmodel').find('label.error').html("Please select a model to proceed");
            } else {
                jQuery('#brandmodel').append('<label class="error">Please select a model to proceed</label>');
            }
        }
        if(jQuery('#model_select').val()) {
            if (jQuery('.custom_case').find('.brand').find('label.error').length) {
                jQuery('.custom_case').find('.brand').find('label.error').html("Please select a model to proceed");
            } else {
                jQuery('.custom_case').find('.brand').append('<label class="error">Please select a brand and then model to proceed</label>');
            }
        }
        else {
            if (jQuery('#brandmodel').find('label.error').length) {
                jQuery('#brandmodel').find('label.error').html("Please select a model to proceed");
            } else {
                jQuery('#brandmodel').append('<label class="error">Please select a model to proceed</label>');
            }

            if (jQuery('.custom_case').find('.brand').find('label.error').length) {
                jQuery('.custom_case').find('.brand').find('label.error').html("Please select a model to proceed");
            } else {
                jQuery('.custom_case').find('.brand').append('<label class="error">Please select a brand and then a model to proceed</label>');
            }
        }
        return false;
    }
}