单击时不显示CSS/Javascript模式对话框

我将按照下面的简单教程构建一个模态对话框

index.html

我不确定这部分是否有必要，但还是包括在内：

custom.js

CSS:

现在，当我单击

.place

列表项时。

#overlay

div不显示

---

这可能是什么原因？

请停止这样做

href=“javascript:void（0）”

@tereško抱歉，我没有编写这部分代码。但我很好奇，为什么？好吧，当你在这样一行上执行滚动点击（在新选项卡中打开）时会发生什么？@tereško我不知道，会发生什么？你的地址栏中会出现

javascript:void（0）

 <div id="results">
    <div id="resultsListing">
        <ol class="results">
            <li class="place clearfix">
                <div class="dish-result">
                    <div class="header clearfix">
                        <a href="javascript:void(0)" class="dish-name"></a><a href=
                            "javascript:void(0)" class="place-name"></a>
                    </div>
                </div>
            </li>
        </ol>
    </div>
</div>

 <div id="overlay">
    <div id="dish-popup-container">
      <div id="dish-popup" class="popup">
        <div class="dish clearfix">
          <div class="header"></div>

          <div class="details">
            <div class="like-button">
              <a href="#" class="button">/* this should replaced with dynamic content
              */</a><span class="counter-b">0</span>
            </div>
          </div><a href="#" class="closeDOMWindow">x</a>
        </div>
      </div>
    </div>
  </div>

function onPlaceClicked(place_id, dish_id, serp) {
    var place = placesById[place_id];
    var dish = getDishById(place, dish_id);
    var dict = {
        place:place,
        dish:dish,
        topDish:dish,
        serp:serp
    };
    changeState({place:place_id, dish:dish_id});

    $(document).trigger('placeClicked', [dict]);
}

function popupPlace(dict) {
    $('div#dish-popup').render(dict,window.dishPopupTemplate);
    if(typeof(dict.dish) === 'undefined') {
        $('div#dish-popup').addClass('place-only');
    } else {
        $('div#dish-popup').removeClass('place-only');
    }

    $('#overlay').show();

    showPopupMap(dict.place, "dish-popup-map");
}

/* Modal Dialog */
function overlay() {
    el = document.getElementById("overlay");
    el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}

/* =Overlay
-------------------------------------------------------------- */
#overlay {
     visibility: hidden;
     position: absolute;
     left: 0px;
     top: 0px;
     width:100%;
     height:100%;
     text-align:center;
     z-index: 1000;
}

#overlay #dish-popup {
     width:300px;
     margin: 100px auto;
     background-color: #fff;
     border:1px solid #000;
     padding:15px;
     text-align:center;
}