Question

我正在使用基础6创建一个网站，我正在尝试将标签组件添加到我的网站，标签的样式与基础文档上的标签一样，但是当我点击它们时它不会切换

突片

<ul class="tabs" data-tabs id="example-tabs">
  <li class="tabs-title is-active"><a href="#panel1" aria-selected="true">Tab 1</a></li>
  <li class="tabs-title"><a href="#panel2">Tab 2</a></li>
  <li class="tabs-title"><a href="#panel3">Tab 3</a></li>
  <li class="tabs-title"><a href="#panel4">Tab 4</a></li>
  <li class="tabs-title"><a href="#panel5">Tab 5</a></li>
  <li class="tabs-title"><a href="#panel6">Tab 6</a></li>
</ul>
tabs 
<div class="tabs-content" data-tabs-content="example-tabs">
  <div class="tabs-panel is-active" id="panel1">
    <p>one</p>
    <p>Check me out! I&#39;m a super cool Tab panel with text content!</p>
  </div>
  <div class="tabs-panel" id="panel2">
    <p>two</p>
    <img class="thumbnail" src="assets/img/rectangle-7.jpg">
  </div>
  <div class="tabs-panel" id="panel3">
    <p>three</p>
    <p>Check me out! I&#39;m a super cool Tab panel with text content!</p>
  </div>
  <div class="tabs-panel" id="panel4">
    <p>four</p>
    <img class="thumbnail" src="assets/img/rectangle-2.jpg">
  </div>
  <div class="tabs-panel" id="panel5">
    <p>five</p>
    <p>Check me out! I&#39;m a super cool Tab panel with text content!</p>
  </div>
  <div class="tabs-panel" id="panel6">
    <p>six</p>
    <img class="thumbnail" src="assets/img/rectangle-8.jpg">
  </div>
</div>

<script src="js/vendor/jquery.min.js"></script>
<script src="js/vendor/what-input.min.js"></script>
<script src="js/foundation.min.js"></script>
<script src="js/app.js"></script>

Answer 1

您必须初始化Foundation javascript，进行以下调用：

<script type="text/javascript">
        $(function () {
            $(document).foundation();
        });
</script>

Answer 2

如果有人遇到这个问题（就像我一样）并且您只是在默认的app.component中构建，我添加了＆＃34; $（document）.foundation（）;＆＃34;对公众ngOnInit（）这样：

        //Code by :: GM

    //REPLACE $data with your data source and include your DB connection


        $data = ['city' => 'Nairobi', 'email' => 'dummy@email.com', 'products' => [array('amount' => 2000, 'name' => 'dummy_product_name', 'p_id' => 1, 'quantity' => 1, 'subtotal' => 1), array('amount' => 2500, 'name' => 'second_dummy_product_name', 'p_id' => 2, 'quantity' => 7, 'subtotal' => 1)]];

        $insert_query_int = 'INSERT INTO purchases SET ';
        $insert_query = $insert_query_int;
        $query_statement_array=[];
        $part_1_store='';
        foreach ($data as $key => $value) {

            //checks if value is string or an array
            if (!is_array($value)) {
                //if value is string

                $part_1 = "$key = '".$value."', ";
                $part_1_store.=$part_1;
                $insert_query.= $part_1;

            } else {
                //if value is an array
                //FOR EACH PRODUCT
                $product_index = 0;
                foreach ($value as $key2 => $value2) {

                    foreach ($value2 as $key3 => $value3) {
                        //add product details to the query statement
                        $insert_query .= "$key3 = '" . $value3 . "', ";

                    }


                   //PRIMING THE LOOP
                    if($product_index!=0){
                       //add product details to the query statement
                        $insert_query = $insert_query_int.$insert_query;
                    }


                    //Remove last comma from query string
                    $insert_query = rtrim(trim($insert_query),',');
                    //Store query statement in an array
                    $query_statement_array[] =$insert_query;
                    $insert_query = $part_1_store;


                    $product_index++;
                }


            }


        }


        //INSERT DATA TO DB
        if (!$conn->multi_query(implode($query_statement_array,';'))) {
           //fail response
            $response["success"]=false;
            $response["error"]=mysqli_error($conn);
            $response["message"]="Creating purchase failed, please retry";
            echo json_encode($response);
            die();
        }

        do {
            if ($res = $conn->store_result()) {
                $res->free();
            }
        } while ($conn->more_results() && $conn->next_result());


        //success response
        $response["success"]=true;
        $response["message"]="Purchase created successfully";
        echo json_encode($response);

// you should consider normalizing your tables

我知道这可能是一个＆＃34; hacky＆＃34;回答但如果你只是在玩游戏并试图让某些东西起作用，那么它对我有用。祝你好运。

基础6标签不单击切换标签

2 个答案: