jQuery匹配Href到div ID

时间:2015-07-03 11:35:06

标签: javascript jquery html css

所以我试图将li元素的HREF与具有ID="gallery"的图库DIV中的DIV ID相匹配。

alert()似乎返回了正确的href属性,但我无法找到匹配元素的ID并将其css显示属性更改为可见;

<ul>

   <li><a class="contentUpdate" href="#logo_branding">Logo Design & Branding</a></li>


   <li><a class="contentUpdate" href="#webdesign">Web Design</a></li>


   <li><a class="contentUpdate" href="#mobileuidesign">Mobile UI Design</a></li>


</ul>


$(".contentUpdate").click(function() {
   var href = $(this).attr("href");
   alert(href);
});

3 个答案:

答案 0 :(得分:2)

如果mobileuidesignhref#mobileuidesign的时候mobileuidesign是div的id,则href可用于创建ID为$(".contentUpdate").click(function() { var href = $(this).attr("href"); $(href).show(); }); 的元素的对象:

    $(document).ready(function () {
        debugger;
        var selectedStateText = $("#ddlState option:selected").text();
        var selectedState = $("#ddlState").val();
        if (selectedStateText == "") {
            $('#divStateDropdown').hide();
            $('#divLabelState').hide();
        }
        $("#ddlCountry").change(function () {
            debugger;
            var selectedCountryText = $("#ddlCountry option:selected").text();
            var selectedCountry = $("#ddlCountry").val();
            $("#selectedCountry").val(selectedCountryText)

            if (selectedCountry == 69) {
                $('#divLabelState').show();
                $('#divStateDropdown').show();
                GetStates(selectedCountry)
            }
            else {
                $('#ddlState').empty();
                $('#divLabelState').hide();
                $('#divStateDropdown').hide();
            }
        })
        $("#ddlState").change(function () {
            debugger;
            var selectedStateText = $("#ddlState option:selected").text();
            $("#selectedState").val(selectedStateText)
        })

    });

    function GetStates(idd)
    {
        $.ajax({
            type: "POST",
            url: "/UserRegistration/GetStates",
            data: JSON.stringify({"id": idd}),
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                var stateslist = $('#ddlState');
                stateslist.empty();
                $(result).each(function () {
                    $(document.createElement('option'))
                    .attr('value', this.Id)
                    .text(this.Value)
                    .appendTo(stateslist);
                });

            }
        });
    };

    function updateDetails() {
        debugger;
        $('#btnUpdate').submit();
    }
</script>



@using (Html.BeginForm("UpdateProfile","UpdateProfile",FormMethod.Post,new {id="Update"}))
    {


                <div class="inputGroupStyle">

                    <div style="width: 100%;padding-top:1%;">
                        @Html.DropDownListFor(model => model.cCountry.CountryID, (SelectList)ViewBag.CountriesList, new { @id = "ddlCountry", style = "width:146px" })
                        @Html.ValidationMessageFor(model => model.cCountry)
                        @Html.HiddenFor(model => model.cCountry.CountrySelected, new { @id="selectedCountry"})
                    </div>
                     <div style="width: 100%;padding-top:1%;" id="divStateDropdown">
                            @Html.DropDownListFor(model => model.cState.StateID, (SelectList)ViewBag.StatesList , new { @id = "ddlState", style = "width:146px;" })

                      @Html.HiddenFor(model => model.cState.StateSelected, new { @id="selectedState"})
                    </div>
                    <div style="width: 100%;padding-top:1%;">
                        @Html.EditorFor(model => model.ZipCode)
                        @Html.ValidationMessageFor(model => model.ZipCode)
                    </div>
                    <div style="width: 100%;padding-top:1%;">
                        @Html.TextBoxFor(model => model.Email, new { @class = "boxSizeEmailPwd-Reg col-xs-12" })
                        @Html.ValidationMessageFor(model => model.Email)
                    </div>
                </div>
            </div>
            <br />
            <div class="form-group">
                <div style="width: 100%; padding-left: 16%;">
                    <input type="submit" id="btnUpdate" value="Save" name="command" onclick="updateDetails();"/>

                    <input type="submit" id="btnCancel" value="Cancel" name="command" class="cancel"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-xs-offset-2 col-xs-10">
                    <input type="submit" value="Create" class="btn btn-default" style="display: none;" />
                </div>
            </div>
        </div>
    }

答案 1 :(得分:0)

您必须先在href中输入id $(&#34; .contentUpdate&#34;)。click(function(){var href = $(this).attr(&#34; href&#34;); $(href).attr(&#39; ID&#39);});

答案 2 :(得分:0)

href has # too。 div id dost。您replace要替换# to nothing

$(".contentUpdate").click(function() {
   var href = $(this).attr("href").replace("#","");
   alert(href);
});