小编Pad*_*han的帖子

我对使用Bootstrap并不陌生，而JS不是我最强的语言，因此我正在努力实现所需的功能。

我有一个用php生成的网站菜单，如下所示：

<?php
$products_menu = '';
$sql1 = "SELECT * FROM headings";
$stmt1 = DB::run($sql1);
while($row = $stmt1->fetch(PDO::FETCH_ASSOC)){
    $heading_id = $row['id'];
    $heading = $row['heading'];

    $products_menu .= '<li class="dropdown-item d-block">';
    $products_menu .= '<a class="submenu-item" href="store#'.$heading_id.'">'.$heading.'</a>';
    $products_menu .= '<ul class="dropdown-submenu">';

    $params = [$heading_id];
    $sql = "SELECT categories.category,categories.url FROM categories INNER JOIN category_headings on categories.id=category_headings.category WHERE category_headings.heading=?";
    $stmt = DB::run($sql,$params);
    while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
        $category = $row['category'];
        $url = $row['url'];

        $products_menu .= '<li class="d-block"><a href="category/'.$url.'">'.$category.'</a></li>';
    }
    $products_menu .= '</ul>';
    $products_menu .= '</li>';
}
?> …

我在我的站点上的控制台中收到以下错误：

Error with Feature-Policy header: Unrecognized feature: 'unsized-media'.
Error with Feature-Policy header: Unrecognized feature: 'ambient-light-sensor'.
Error with Feature-Policy header: Unrecognized feature: 'speaker'.
Error with Feature-Policy header: Unrecognized feature: 'vr'.

我是一名前端 Web 开发人员，所以我试图按照此处的描述在 JS 中进行设置https://developers.google.com/web/updates/2018/06/feature-policy#js而不会弄乱我的服务器配置。

console.log(document.featurePolicy.allowedFeatures());

结果是：

["geolocation", "midi", "ch-ect", "usb", "magnetometer", "picture-in-picture", "publickey-credentials-get", "accelerometer", "ch-lang", "document-domain", "encrypted-media", "ch-downlink", "ch-ua-arch", "xr-spatial-tracking", "ch-ua-platform-version", "ch-width", "ch-ua-model", "sync-xhr", "camera", "ch-viewport-width", "payment", "ch-rtt", "ch-ua-full-version", "fullscreen", "autoplay", "ch-dpr", "ch-ua-platform", "screen-wake-lock", "gyroscope", "ch-ua-mobile", "ch-device-memory", "ch-ua", "microphone"]

还

document.featurePolicy.allowsFeature('unsized-media', 'self');

结果是：

Invalid origin url for feature …

我正在创建一个电子商务网站，我以前一直使用 Magento，但现在改为自定义构建的网站。

在这个网站上，我创建了一个名为 的页面create_account.php，这在一段时间内表现良好并且运行良好，但随后它开始抛出我以前从未见过的 410 错误。做了一些研究，可以发现这表明该文件确实存在，但不再存在。

我认为很公平，也许 Magento 有一个同名的文件，并且它有该文件被删除的记录，因此它停止读取我的文件，所以我将创建它的副本，将其命名为其他名称并更改对此的所有引用文件更改为新名称account_create.php，并在我的文件中放入一行.htaccess，以将可能会转到第一个文件的用户重定向到我的新文件，但我将原始文件留在了服务器上。

这在多台计算机/浏览器/网络等上运行了一段时间（我谈论的是几天而不是几小时/分钟），但后来发生了同样的事情。这次我认为这不可能是 Magento 留下的东西或服务器仍然有记录的其他东西，但如果上次修复有效，我会尝试一下，看看效果如何。

现在，这种情况已经发生了 6 次，同一个文件有 6 个不同的文件名，在一个月内它运行了几天，然后服务器说该文件消失了。然而，所有 6 个文件仍然位于我服务器的主目录中。我有一个带有新名称的第七个版本，目前正在运行，但我不抱希望，我的.htaccess文件变得很荒谬。

  RewriteRule ^create_account/?$ create.php [L,NC,QSA]
  RewriteRule ^createaccount/?$ create.php [L,NC,QSA]
  RewriteRule ^accountcreate/?$ create.php [L,NC,QSA]
  RewriteRule ^account_create/?$ create.php [L,NC,QSA]
  RewriteRule ^account_creation/?$ create.php [L,NC,QSA]
  RewriteRule ^accountcreation/?$ create.php [L,NC,QSA]

我开始怀疑实际的文件本身，尽管在 WAMP 上本地一切都工作正常，并且在这种情况发生之前它可以正常工作一段时间。这是该文件的内容：

<?php
$active_country_id = $_SESSION["active_country_id"];
$active_country_name = $_SESSION["active_country_name"];
$active_country_code = $_SESSION["active_country_code"];
$active_country_currency = $_SESSION["active_country_currency"];
$active_country_vat = $_SESSION["active_country_vat"];
$active_country_braintree = $_SESSION["active_country_braintree"];

$message = "";
$first_name = "";
$last_name …

我有一个电子商务网站,其产品具有多种属性(例如尺寸,颜色等).

在每个产品页面上,每个属性都有一个下拉列表'attribute_price'.

我还从我的数据库中预装了隐藏的输入到每个产品的定价'hidden_attribute_value'.

因此,并非每种尺寸和颜色的组合都是一种选择.例如,我们可能有'small_red'或'medium_red'没有'large_red'

因此,如果他们'large'从尺寸下拉菜单中选择,'red'则不应该是颜色的选项.

到目前为止我所拥有的是:

$("select.attribute_price").on("change", function(){

    var id = event.target.id;
    // determine which dropdown was changed (size or colour)
    var attribute_value = document.getElementById(id).value+'_';
    // get the value of the dropdown that they selected

    var other_attribute_ids = []
    var i;
    var other_attributes = document.getElementsByClassName("attribute_price");
    for(i=0; i<other_attributes.length; i++){
        if(other_attributes[i].id != id){
            var other_attribute_id = document.getElementById(other_attributes[i].id).id;
            other_attribute_ids.push(other_attribute_id);
        }
    }
    // create an array of all of the other …

我正在尝试为我的网站创建一个产品搜索，用户可以在其中搜索多种语言的产品，如果没有完全匹配的信息，（希望）获得模糊的搜索结果。

• 我有一个pro_search带有列的表id, pro_id, en, de, es, fr, it。
• 该pro_id列指的是其各自表中产品的ID。
• 这些en, de, es, fr, it列具有每种产品的各种语言的翻译后的meta。
• 元只是由空格分隔的关键字
• $term 是搜索词。
• $lang 指用户选择的语言

因此，首先，我执行一个基本的“ LIKE” SQL查询以查看是否存在匹配项，如果没有结果，则查询所有产品，并使用similar_text()函数创建一个按其相似性排序的数组

例如，我搜索“衬衫”，如果该产品的元数据仅包含单词“衬衫”，则很好，但如果元数据包含“蓝色品牌的T恤”，则说明性更强，为用户提供了按品牌进行搜索的机会，但意味着搜索将很可能变得模糊，而不是通过LIKESQL查询找到。

这是一种工作，但是我想知道如何改进它，是否有更好的搜索方法，或者人们通常会如何做？我是否应该将meta分为每个单独的关键字，并尝试查看有多少个单词匹配，而不是将术语与整个meta匹配？

    $ids = [];

    $params = ['%'.$term.'%'];
    $sql = "SELECT * FROM pro_search WHERE $lang LIKE ?";
    $stmt = DB::run($sql,$params);

    $count = $stmt->rowCount();
    if($count > 0){

        // product search
        while ($row = $stmt->fetch(PDO::FETCH_ASSOC)){
            $id = $row["pro_id"];
            array_push($ids,$id);
        }
        show_products($ids);

    }else{

        // product fuzzy search
        $sql …

因此 Apple/Safari 对于各种元素都有自己的 CSS，例如<select>或<button>。

我可以通过使用来解决这个问题，-webkit-appearance:none;但对于我的<select>，这也是删除我想保留的小下拉箭头。

有没有办法解决这个问题，删除其他附加样式但保留箭头，或者以跨浏览器一致的方式替换箭头？

我有一个数据库，其中包含许多条目，数据如下：

id  number  data
1   1       'tyfvib'
2   1       'fgdhjjd'
3   1       'gdgdhdj'
4   2       'dgfhfh'
5   2       'fghdhd'

所以我有一个唯一的 ID，然后是一个包含数字的列，然后是一个包含不同字符串的列。

然后我有一个这样的查询：

$sql = "SELECT * FROM table";
$stmt = DB::run($sql);
while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
    $number= $row['number'];
    $data = $row['data'];
}

我想创建一个多维关联数组，它首先有一个唯一数字的数组，并且这些数组将包含与它们关联的数据的数组。

我曾尝试放入$array[$number] = $datawhile 循环中，但这显然只会创建一个数组，其中与数字关联的唯一数据是循环中的最后一个数据。

我正在尝试修改我网站上的 TrustPilot 小部件。

TrustPilot 小部件的基本结构是：

#tp-widget_wrapper .tp-widget-wrapper
    #wrapper-top .wrapper-top
        #tp-widget-reviews-wrapper .tp-widget-reviews-wrapper hidden-element
            #tp-widget-reviews .tp-widget-reviews
                .tp-widget-review
                    .tp-widget-stars
                    .date

我试图隐藏 div .date。

到目前为止我得到的是：

var trustpilot_children = document.getElementById("trustpilot_widget").childNodes;
var trustpilot_frame = trustpilot_children[0];
var date_tags = trustpilot_frame.document.getElementsByClassName("date");
date_tags.style.display = "none";

但是我收到错误：

Uncaught TypeError: Cannot read property 'getElementsByClassName' of undefined

var trustpilot_frame 正在查找 iframe，我只是无法访问其中的任何内容。

编辑

var trustpilot_children = document.getElementById("trustpilot_widget").childNodes;
var trustpilot_frame = trustpilot_children[0].contentDocument;
console.log(trustpilot_frame);
var date_tags = trustpilot_frame.getElementsByClassName("date");
console.log(date_tags);
date_tags.style.display = "none";

安慰：

编辑2

var trustpilot_children = document.getElementById("trustpilot_widget").childNodes;
var trustpilot_frame = trustpilot_children[0].contentDocument;
var style_tag …

我是引导程序的新手，所以我不确定我会怎么做。

我有一个简单的引导手风琴，就像在这个片段中一样。它被分成多个手风琴，因为我希望它们能够彼此独立地展开和折叠。（因为可以展开并显示所有项目或不显示所有项目，而不仅仅是一个展开而其他项目折叠）

我想禁用桌面上的展开和折叠，并确保显示每个项目。但是在移动设备上，我只想显示第一个项目，默认情况下其他项目折叠。

任何关于我如何实现这一目标的建议将不胜感激。

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

<div id="accordion">
  <div class="card">
    <div class="card-header" id="heading1">
      <button class="btn btn-default" data-toggle="collapse" data-target="#body1" aria-expanded="true" aria-controls="body1">
        //heading
      </button>
    </div>
    <div id="body1" class="collapse show" aria-labelledby="heading1" data-parent="#accordion">
      <div class="product card-body">
        //content
      </div>
    </div>
  </div>
</div>

<div id="accordion">
  <div class="card">
    <div class="card-header" id="heading2">
      <button class="btn btn-default" data-toggle="collapse" data-target="#body2" aria-expanded="true" aria-controls="body2">
        //heading
      </button>
    </div>
    <div id="body2" class="collapse show" aria-labelledby="heading2" data-parent="#accordion">
      <div class="product card-body">
        //content
      </div> …

我有一个表格，其中每两个单元格都是相关的，我想用背景颜色来区分它们。

每第三个和第四个孩子都不起作用，我需要它是每第二组 2 列。

td:nth-child(3n), td:nth-child(4n){
    background-color:#ddd;
}

<table>
<tr>
<td>1a</td><td>1b</td>
<td>2a</td><td>2b</td>
<td>3a</td><td>3b</td>
<td>4a</td><td>4b</td>
</tr>
</table>