Textarea没有更新

时间:2014-12-30 17:44:28

标签: javascript jquery html

仅当用户单击复选框并提交时,才尝试使用自定义构建示例生成和加载代码页。然而,textarea似乎根本没有更新。

我试图让我的代码像这个例子一样工作 http://gregfranko.com/jquery.selectBoxIt.js/customDownload.html

的jsfiddle http://jsfiddle.net/lollipopwizardkid/ujp0b1uw/

这是代码。

<section class="custom-downloads" id="css-downloads">
  <div class="page-header">
    <a class="btn btn-small pull-right toggle-all" href="#">Toggle all</a>
    <h1>
      1. Choose and Download CSS components
      <small>Get just the CSS you need</small>
    </h1>
  </div>
  <div class="row">
    <div class="span3">
      <label class="checkbox"><input checked="checked" type="checkbox" value="selectboxit/jquery.selectBoxIt.css"> SelectBoxIt CSS</label>
    </div>
  </div>
  <br />
  <a class="btn" data-bind="css-downloads" id="css-generate">Generate CSS</a>
  <a class="btn btn-primary download-button" id="css-download" download="jquery.selectboxit.css">Download CSS</a>
  <br /><br />
  <textarea class="source-area default sourceView" id="generated-css-source">// Minified source</textarea>
</section>

<section class="custom-downloads" id="javascript-downloads">
  <div class="page-header">
    <a class="btn btn-small pull-right toggle-all" href="#">Toggle all</a>
    <h1>
      2. Choose and Download JavaScript components
      <small>Get just the JavaScript you need</small>
    </h1>
  </div>
  <div class="row">
    <div class="span3">
      <label class="checkbox"><input checked="checked" type="checkbox" value="selectboxit/jquery.selectBoxIt.core.min.js" disabled> SelectBoxIt Core</label>
      <label class="checkbox"><input checked="checked" type="checkbox" value="selectboxit/jquery.selectBoxIt.ariaAccessibility.min.js"> Aria Accessibility</label>
      <label class="checkbox"><input checked="checked" type="checkbox" value="selectboxit/jquery.selectBoxIt.destroy.min.js"> Destroy method</label>
      <label class="checkbox"><input checked="checked" type="checkbox" value="selectboxit/jquery.selectBoxIt.disable.min.js"> Disable method</label>
    </div>

  </div><!-- /row -->
  <br />
  <a class="btn" href="#" data-bind="javascript-downloads" id="javascript-generate">Generate JavaScript</a>
  <a class="btn btn-primary download-button" id="javascript-download" download="jquery.selectboxit.js">Download JavaScript</a>
  <br /><br />
  <textarea class="source-area default sourceView" id="generated-javascript-source">// Minified source</textarea>
</section>
</div>

    </div><!--/.fluid-container-->
    <div class="modal hide fade" id="myModal">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h3>Downloads</h3>
        </div>
        <div class="modal-body">
            <a class="btn btn-large" href="#" target="_blank" data-lang="css" download="jquery.selectboxit.css">Download CSS</a>
            <a class="btn btn-large" href="#" target="_blank" data-lang="javascript">Download JavaScript</a>
        </div>
    </div>
    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.7.2.min.js"></script>
    <script src="js/jquery-ui-1.8.22.custom.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.tocify.min.js"></script>
    <script src ="js/base64.js"></script>
    <script src="js/javascripts/DownloadBuilder.js"></script>
    <script>

        $(function() {

            $("a[href='#']").click(function(event) {

                event.preventDefault();

            });

            $(".toggle-all").on("click", function() {

                $(this).parent().parent().find('input[type="checkbox"]').not(":disabled").each(function() {

                    $(this).attr("checked", !$(this).attr("checked"));

                });

            });

            var builder = new DownloadBuilder();

            $("#css-generate").on("click", function() {

                builder.buildURL($("#css-downloads input[type='checkbox']:checked"), "jquery.selectboxit.css", "css", function(data) {

                    $("#generated-css-source").text(data.content);

                    if(!data.content) {

                        $("#css-download").fadeOut("slow");

                    }

                    if(data.url) {

                        $("#css-download").attr("href", data.url).fadeIn("slow");

                    }

                });

            });

            $("#javascript-generate").on("click", function() {

                builder.buildURL($("#javascript-downloads input[type='checkbox']:checked"), "jquery.selectboxit.js", "javascript", function(data) {

                    $("#generated-javascript-source").text(data.content);

                    if(!data.content) {

                        $("#javascript-download").fadeOut("slow");

                    }

                    if(data.url) {

                        $("#javascript-download").attr("href", data.url).fadeIn("slow");

                    }

                });

            });

        });

    </script>

  </body>
</html>

0 个答案:

没有答案
相关问题