如何让我的javascript寻找类或val之外的任何东西

Question

我有一个javascript脚本,它会查找值和下拉列表,并根据值来更改下一个下拉菜单,但是这将不再适用于我,因为我需要将值传递给ruby,以便我可以将其保存在会话.

$(document).ready(function() {
    $('#Exposures').bind('change', function() {
        var elements = $('div.exposures').children().hide(); // hide all the elements
        var value = $(this).val();

        if (value.length) { // if something is selected
            elements.filter('.' + value).show(); // show the ones we want
        }
    }).trigger('change');
    
    $('.second-level-select').bind('change', function() {
        var elements = $('div.second-level-container').children().hide(); // hide all the elements
        var value = $(this).val();

        if (value.length) { // if something is selected
            elements.filter('.' + value).show(); // show the ones we want
        }
    }).trigger('change');

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<select class="pmmargin3 exp" size="1" id="Exposures" title="" name="exposures_pt1">
    <option selected disabled hidden style='display:none' value=''>-Please select an option-</option>
    <option value="1">thing1</option>
    <option value="1">thing2</option>
    <option value="2">thing3</option>
    <option value="1">thing4</option>
    <option value="3">thing5</option>
 
    </select>

    <div class="container exposures leftmargin exp">
    <div class="1">
        <select class="second-level-select" name="exposures_pt2a">
            <option selected disabled hidden style='display:none' value=''>-     Please select an option-</option>
            <option value="guardrail_system">thing1</option>
            <option value="personal_fall">thing2</option>
            <option value="safety_net">thing3</option>
        </select>
    </div>
    <div class="2">
        <select class="second-level-select" name="exposures_pt2b">
            <option selected disabled hidden style='display:none' value=''>-Please select an option-</option>
            <option value="guardrail_system">thing1</option>
            <option value="personal_fall">thing2</option>
            <option value="safety_net">thing3</option>
            <option value="infeasibility_option">thing4</option>
        </select>
    </div>
    <div class="3">
        <select class="second-level-select" name="exposures_pt2c">
            <option selected disabled hidden style='display:none' value=''>-Please select an option-</option>
            <option value="current_subpart">thing5</option>
            <option value="proposed_subpart">thing6</option>
        </select>
    </div>
  </div>

感谢您的帮助,我是Javascript的新手,我正在努力,但仍需要一些指导.

Answer 1

好吧，我想出了如何取回结果并在代码中保持值相同，所以这里没有其他任何问题，这就是我的做法。

$(document).ready(function() {
$('#Exposures').bind('change', function() {
    var elements = $('div.exposures').children().hide(); // hide all the elements
    var value = $(this).val();
    *added* var exposuredd = document.getElementById("Exposures");
    *added*  var selectedText = exposuredd.options[exposuredd.selectedIndex].text;
 *added*   document.getElementById("exp1").innerHTML="<input type='text' name='exposures_pt1' value='"+selectedText+"' >";

    if (value.length) { // if somethings' selected
        elements.filter('.' + value).show(); // show the ones we want
    }
}).trigger('change');

$('.second-level-select').bind('change', function() {
    var elements = $('div.second-level-container').children().hide(); // hide all the elements
    var value = $(this).val();

    if (value.length) { // if somethings' selected
        elements.filter('.' + value).show(); // show the ones we want
    }
}).trigger('change');

});

这需要在 erb 中，我在中使用它

<p hidden  id="exp1"></p>

所以现在我可以将选项中的任何文本传递给 ruby​​，例如......“嘿，我在这里”

 <option value="1">Hey Here I am</option>