Mohammad的社区主页

Mohammad 最近回复了

6 年前

回复了 Mohammad 创建的主题 » 使用jQuery选择具有两个特定子级的父级

你需要选择 a 标记然后使用 :has() 筛选元素的选择器具有特定的子级。

$('a:has(span:contains("11:00am")):has(span.name:contains("Tom"))')

$('a:has(span:contains("11:00am")):has(span.name:contains("Tom"))').css("background-color","rgb(255, 255, 255)");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a style="background-color: rgb(0, 0, 0);">
  <div class="time">
    <span>11:00am</span>
  </div>
  <span class="name">Tom</span>
</a>
<a style="background-color: rgb(0, 0, 0);">
  <div class="time">
    <span>11:00am</span>
  </div>
  <span class="name">Jack</span>
</a>

6 年前

回复了 Mohammad 创建的主题 » 如何使用jQuery更改TR的背景颜色?

遍历行并在函数中获取 style 属性 tr 并使用regex查找十六进制值 background 检查一下。

$(".myTabl tr").each(function(){
  var match = $(this).attr("style").match(/background\s*:\s*#(\w+)/);
  if (match != null && match[1] == "f00")
    $(this).css("background-color", "blue");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-bordered myTabl">
  <tr style="background:#ff0">
     <td>...</td>
  </tr>
  <tr style="background:#f00; font-size:12px">
     <td>...</td>
  </tr>
  <tr style="background:#ff0">
     <td>...</td>
  </tr>
  <tr style="font-size:12px; background   :   #f00">
     <td>...</td>
  </tr>
</table>

6 年前

回复了 Mohammad 创建的主题 » 使用jquery显示自定义样式输入文件的文件名

输入更改时需要获取文件名并将其插入HTML。在代码中 this.files[0].name 获取所选文件的名称。

$("#file-upload").change(function(){
  $("#file-name").text(this.files[0].name);
});

$("#file-upload").change(function(){
  $("#file-name").text(this.files[0].name);
});

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
    <label for="file-upload" class="custom-file-upload">
        <i class="fa fa-cloud-upload"></i> Upload Image
    </label>
    <input id="file-upload" name='upload_cont_img' type="file" style="display:none;">
    <label id="file-name"></label>
</form>

你也可以用 纯javascript

document.querySelector("#file-upload").onchange = function(){
  document.querySelector("#file-name").textContent = this.files[0].name;
}

document.querySelector("#file-upload").onchange = function(){
  document.querySelector("#file-name").textContent = this.files[0].name;
}

.custom-file-upload {
  border: 1px solid #ccc;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer; 
}

<form>
  <label for="file-upload" class="custom-file-upload">
    <i class="fa fa-cloud-upload"></i> Upload Image
  </label>
  <input id="file-upload" name='upload_cont_img' type="file" style="display:none;">
  <label id="file-name"></label>
</form>

6 年前

回复了 Mohammad 创建的主题 » 使用jquery显示自定义样式输入文件的文件名

您必须绑定并触发 [type=file] 元素并将文件名读取为:

$('#file-upload').change(function() {
  var i = $(this).prev('label').clone();
  var file = $('#file-upload')[0].files[0].name;
  $(this).prev('label').text(file);
});

.custom-file-upload {
  border: 1px solid #ccc;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <label for="file-upload" class="custom-file-upload">
    <i class="fa fa-cloud-upload"></i> Upload Image
  </label>
  <input id="file-upload" name='upload_cont_img' type="file" style="display:none;">
</form>

» Mohammad 创建的更多回复